@media (width < 720px){

html{
    width:100%;
    height:auto;
    margin:0;
    padding:0
}

body{
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
    background:rgba(205, 205, 205, 0.4);
}

header{
    width: 100%;
    height: auto;
    background-color:  #2d1baa;
    display: flex;
    justify-content: center;
    align-items:baseline ;
}

header .img{
    width: 20%;
    height: auto;
    margin: 0;
    text-align: center;
}

#logo{
    width: 75px;
    height: auto;
}

header nav{
    width: 80%;
    height: auto;
    margin: 0;
    text-align:center;
}

header nav ul{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}

header nav ul li{
    width: 20%;
    height: auto;
    display: inline-block;
    margin: 0;
    padding: 0;
}

header nav ul li a{
    width: 100%;
    font-size: 2vw;
    color: white;
    text-decoration:none;
}

#Inicio{
    width: 100%;
    height: auto;
    position:relative;
    display: block;
}

h1{
    position:absolute;
    font-size: 2em;
    text-align: center;
    z-index: 20;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Inicio img{
    width: 100%;
    height: auto;
    position:relative;
    margin: 0;
    padding: 0;
    box-sizing: border-box; 
    z-index: 10;
}

#que {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: 2/4;
    grid-row: -2/-1;
    z-index: 20;
}

#por {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: -5/-6;
    grid-row: -1/-2;
    z-index: 20;
}

#para {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: -2/-4;
    grid-row: -1/-2;
    z-index: 20;
}

h3{
    width: 100%;
    height: auto;
    margin: 0;
    padding: .5rem 1rem;
    text-align: center;
    box-sizing: border-box;
    font-size: 1rem;
    
}

p {
        width: 100%;
        height: auto;
        margin: 0;
        padding: .5rem 1rem;
        text-align: center;
        box-sizing: border-box;  
        font-size: 1rem;
}

#Planes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    display: block;
    justify-content: center;
}

#inicioplanes{
    font-size: 2em;
    text-align: center;
    z-index: 20;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Planes div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 2% 1% 2% 2%;
    position: relative;
    display: inline-block;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.Plan-1mes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-1mes h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #f1c40f , #e67e22);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-1mes ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-1mes li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-1mes button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #f1c40f , #e67e22);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-3meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-3meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #e67e22 , #8e44ad);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-3meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-3meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-3meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #e67e22 , #8e44ad);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-6meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-6meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #8e44ad , #2980b9);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-6meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-6meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-6meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #8e44ad , #2980b9);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-12meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-12meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #2980b9 , #2ecc71);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-12meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-12meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-12meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #2980b9 , #2ecc71);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

#Dispositivos{
    width: 100%;
    height: auto; 
    background: whitesmoke;
    margin: 0;
    padding: 0;
    position: relative;
    justify-content: center;
}

.iniciodisp{
    padding: 3% 0 0 0;
    font-size: 2em;
    text-align: center;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Dispositivos div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    display: block;
    justify-content: center;
}

#Dispositivos div img{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#Dispositivos div ul{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 3%;
    display: flex;
    box-sizing: border-box;
    list-style: none;
}

#Dispositivos div ul li{
    width: 14.28%;
    height: 100px;
    margin: 0;
    padding: 0;
    position: relative;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

#Dispositivos div ul li p{
    display:none;
}
    
#Dispositivos div ul li img{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0 5%;
    position: relative;
    filter: grayscale(100%);
}

#PreguntasFrecuentes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

#PreguntasFrecuentes div{
    padding: 0 2% 4% 2%;
    position: relative;
    display: block;
    justify-content: center;
    box-sizing: border-box;
}


.quest1{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;

}

.quest1 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest1 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest2 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest2 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest2 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest3 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest3 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest3 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest4 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest4 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest4 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest5 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest5 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest5 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest6 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest6 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest6 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest7 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest7 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest7 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest8 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest8 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest8 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest9 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest9 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest9 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest10 {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest10 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest10 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

#Descarga{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

.iniciodesc{
    padding: 0;
    font-size: 2rem;
    text-align: center;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Descarga div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

#Descarga div ul{
    width:100%;
    height: auto;
    margin: 0;
    padding: 0 2% 4% 2%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: center;
    box-sizing: border-box;
    list-style:none;
}

#Descarga div ul li{
    width: 24%;
    height: auto;
    margin: 1% .5%;
    padding:0;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;
    align-items: center;
    text-align: center;
}

#Descarga div ul li img{
    width: 90%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
    filter: grayscale(100%);
}

#Descarga div ul li a{
    width: 100%;
    height: auto;
    padding: 0;
    color: white;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

footer {
    width: 100%;
    height: auto;
    background-color:  #2d1baa;
    display: flex;
    justify-content: center;
    align-items:baseline ;
    color: #ffffff;
    text-align: center;
    font-size: 1rem;
}

footer div a{
    color:white;
}
}

  /* Equipo con pantalla de mas de 720px..............................*/
  
@media (width > 720px){
    
html{
    width:100%;
    height: auto;
    margin: 0;
    padding: 0;
}

body{
    width: 100%;
    height: auto;
    margin: 0;
    display: block;
    background:rgba(205, 205, 205, 0.4);
}

header{
    width: 100%;
    height: auto;
    background-color:  #2d1baa;
    display: flex;
    justify-content: center;
    align-items:baseline ;
}

header .img{
    width: 20%;
    height: auto;
    margin: 0;
    text-align: center;
}

#logo{
    width: 75px;
    height: auto;
}

header nav{
    width: 80%;
    height: auto;
    margin: 0;
    text-align:center;
}

header nav ul{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}

header nav ul li{
    width: 20%;
    height: auto;
    display: inline-block;
    margin: 0;
    padding: 0;
}

header nav ul li a{
    width: 100%;
    font-size: 2vw;
    color: white;
    text-decoration:none;
}

#Inicio{
    width: 100%;
    height: auto;
    display: grid;
    grid-template-columns: 7.5% 2.5% 22.5% 5% 25% 5% 22.5% 2.5% 7.5%;
    grid-template-rows: 10% 40% 50%;
}

h1{
    font-size: 2em;
    text-align: center;
    grid-column: 3/8;
    grid-row: 1/2;
    z-index: 20;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Inicio img{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box; 
    grid-column: 2 / 9;
    grid-row: 2/4;
    z-index: 10;
}

#que {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: 2/4;
    grid-row: -2/-1;
    z-index: 20;
}

#por {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: -5/-6;
    grid-row: -1/-2;
    z-index: 20;
}

#para {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;  
    background:rgba(205, 213, 224, 0.4);
    border-radius:4%;
    grid-column: -2/-4;
    grid-row: -1/-2;
    z-index: 20;
}

h3{
    width: 100%;
    height: auto;
    margin: 0;
    padding: .5rem 1rem;
    text-align: center;
    box-sizing: border-box;
    font-size: 1rem;
    
}

p {
        width: 100%;
        height: auto;
        margin: 0;
        padding: .5rem 1rem;
        text-align: center;
        box-sizing: border-box;  
        font-size: 1rem;
}

#Planes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    display: flex;
    justify-content: center;
}

#inicioplanes{
    font-size: 2em;
    text-align: center;
    grid-column: 3/8;
    grid-row: 1/2;
    z-index: 20;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Planes div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 2% 1% 2% 2%;
    position: relative;
    display: inline-block;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.Plan-1mes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-1mes h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #f1c40f , #e67e22);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-1mes ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-1mes li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-1mes button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #f1c40f , #e67e22);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-3meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-3meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #e67e22 , #8e44ad);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-3meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-3meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-3meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #e67e22 , #8e44ad);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-6meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-6meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #8e44ad , #2980b9);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-6meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-6meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-6meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #8e44ad , #2980b9);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

.Plan-12meses{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 1rem .5rem;
    display: block;
    text-decoration: none;
    box-sizing: border-box;
}

.Plan-12meses h2{
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem .5rem;
    color: #ffffff;
    font-size: 1.5rem;
    text-transform: uppercase;
    box-sizing: border-box;
    border-radius: 45px 0 0 0;
    background: linear-gradient(to right, #2980b9 , #2ecc71);
}

.features {
    width: 100%;
    height: auto;
    background: white;
    border-radius: 0 0 45px 0;
}

.Plan-12meses ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
}

.Plan-12meses li {
    margin: 0;
    padding: 2%;
    font-size: 1rem;
    box-sizing: border-box;
}

.Plan-12meses button {
    width: 75%;
    height: auto;
    background: linear-gradient(to right, #2980b9 , #2ecc71);
    color: white;
    border: none;
    margin: 5%;
    padding: 5% 10%;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
}

#Dispositivos{
    width: 100%;
    height: auto; 
    background: whitesmoke;
    margin: 0;
    padding: 0;
    position: relative;
    justify-content: center;
}

.iniciodisp{
    padding: 3% 0 0 0;
    font-size: 2em;
    text-align: center;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Dispositivos div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    display: flex;
    justify-content: center;
}

#Dispositivos div img{
    width: 50%;
    height: auto;
    margin: 0;
    padding: 0 0 0 7.5%;
    box-sizing: border-box;
}

#Dispositivos div ul{
    width: 50%;
    height: auto;
    margin: 0;
    padding: 3%;
    display: grid;
    box-sizing: border-box;
    list-style: none;
    grid-template-columns:50% 50%;
    grid-template-rows: 25% 25% 25% 25%;
}

#Dispositivos div ul li{
    width: 50%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    display: block;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

#Dispositivos div ul li img{
    width: 80%;
    height: auto;
    margin: 0;
    padding: 0 5%;
    position: relative;
    filter: grayscale(100%);
}

#PreguntasFrecuentes{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

#PreguntasFrecuentes div{
    padding: 0 2% 4% 2%;
    position: relative;
    display: flex;
    justify-content: center;
    box-sizing: border-box;
    flex-wrap: wrap;
}


.quest1{
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;

}

.quest1 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest1 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest2 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest2 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest2 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest3 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest3 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest3 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest4 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest4 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest4 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest5 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest5 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest5 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest6 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest6 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest6 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest7 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest7 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest7 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest8 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest8 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest8 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest9 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest9 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest9 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

.quest10 {
    width: 33%;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
}

.quest10 h4{
    width: 100%;
    height: auto;
    margin: 0;
    padding:10% 20% 0 20%;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;

}

.quest10 p{
    width: 100%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

#Descarga{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

.iniciodesc{
    padding: 0;
    font-size: 2rem;
    text-align: center;
    color: white;
    -webkit-text-stroke: 1px #2d1baa;
    text-shadow: 0px 4px 4px #282828;
}

#Descarga div{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

#Descarga div ul{
    width:100%;
    height: auto;
    margin: 0;
    padding: 0 2% 4% 2%;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: center;
    box-sizing: border-box;
}

#Descarga div ul li{
    width: 14.2%;
    height: auto;
    margin: 0;
    padding:5% 0 0 0;
    background: #041434;
    color: white;
    font-size: 1rem;
    border-radius: 45px 0 0 0;
    box-sizing: border-box;
    align-items: center;
    text-align: center;
}

#Descarga div ul li img{
    width: 90%;
    height: auto;
    padding: 10% 20%;
    background: white;
    color: #041434;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
    filter: grayscale(100%);
}

#Descarga div ul li a{
    width: 100%;
    height: auto;
    padding: 0;
    color: white;
    font-size: 1rem;
    border-radius: 0 0 45px 0;
    box-sizing: border-box;
}

footer {
    width: 100%;
    height: auto;
    background-color:  #2d1baa;
    display: flex;
    justify-content: center;
    align-items:baseline ;
    color: #ffffff;
    text-align: center;
    font-size: 1rem;
}

}