@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500&display=swap');



    :root{
        --azul: #4682B4;
        --azulpalido:  #B0E0E6;
        --degradado:linear-gradient(90deg,var(--azulpalido)var(--azul));

    }





*{font-family: 'Poppins', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    outline: none;
    border: none;
  
    }

    *::selection{
                background: var(--azulpalido);
                color:white;
    }
    html{
        font-size: 62-4%;
        overflow:hidden;
        overflow: scroll;
    }
    body{
        background: white  ;
               }
        



               .logo1{            
                margin-left: 1%;
                
                border-radius: 4px;
                padding: 5px;
                width: 150px;
            


               }
        section{
            min-height: 100vh;
            padding: 0 9%;
            padding-top: 7.5rem;
            padding-bottom: 2rem;
        }
        .btn{

            display: inline-block;
            margin-top: 1rem;
            padding: .8rem 3rem;
            border-radius: 5rem;
            background: var(--azul);
            font-size: 1.8rem;
            color: white;
            cursor: pointer;
            box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1);
            transition: all .3s linear;

        }
    .btn:hover{
        transform: scale(1.1);
    }


        .heading{

            text-align: center;
            background: #0D9C87;
        
            color: transparent;
            -webkit-background-clip: text;
            background-clip: text;
            font-size: 3rem;
            text-transform: uppercase;
            padding: 2rem;
        }
       



      

header{
      position: fixed;
       top: 0;
       left: 0;
       width: 100%;
       background-color: white;
       box-shadow: 0.5rem 1rem rgba(0, 0, 0, .1);
       padding: 2rem 9%;
       display: flex;
       align-items: center;
       justify-content: space-between;
       z-index: 1000;
}
header .logo{
font-size: 2rem;

}
header .logo .img{

    width: 100px;
    height: 100px;

}
 header .logo span{
    color: var(--azul);
     }
    header .navbar a{
        font-size: 1rem;
        margin-left: 2rem;
        color: #007cf0;
    }
    header .navbar a:hover{
        color:var(--azulpalido);
    }
header input{
    display: none;}


header label{
    font-size: 3rem;
    color: var(--azul);
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
}
.inicio{

 display: flex;
 align-items: center;
 justify-content: center;
background-size: cover;
background-position: center;

}

.inicio img{
  margin: 3rem;
    width: 100%;
    left: 340px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}




.inicio .content h3{
    text-align: center;
    font-size: 3rem;

    color: rgb(0, 0, 0);
    text-transform: uppercase;
    }

.inicio .content h3 span{
    color:var(--azul);
    text-transform: uppercase;
}

.inicio .content p{
    font-size: 1.7rem;
    color: #666;
    padding: 1rem 0;
}

.precios .caja-contenedor{
  
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.precios .caja-contenedor .caja{
    flex: 1 1 30rem;
    margin: 1rem;
    padding: 1rem;
    background: var(--degradado);
    border: .1rem  solid rgba(0, 0, 0, .2);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1);
    border-radius: .5rem;
    text-align: center;
    padding-bottom: 3rem;
}
.precios .caja-contenedor .caja:nth-child(2) ,
.precios .caja-contenedor .caja:hover{
    border: .2rem solid var(--azul);

}
.precios .caja-contenedor .caja .titulo{    

color: var(--azul);
font-size: 2rem;
padding-top: 1rem;

}
.precios .caja-contenedor .caja .tipos{

     font-size: 3rem;
     color: var(--azul);
     padding: 1rem 0;
}
.precios .caja-contenedor .caja .tipos span{
    font-size: 2rem;  
   
  
}
.precios .caja-contenedor .caja ul{
    padding: 1rem 0;
    list-style: none;


  }

  .precios .caja-contenedor .caja ul li{
  
    font-size: 1rem;
    color:black;
    padding: .5rem 0;
   
 

   
    
  }
.precios .caja-contenedor .caja ul li .fa-check{
    color: lightseagreen;
    
    
   
}

.contactos{
   
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
       

}
.contactos form{
    flex: 1 1 40rem;
    padding: 2rem 3rem;
    border: .1rem solid rgba(0, 0, 0, .2);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1);
    border-radius: .5rem;
    background-color: white;
    }

.contactos .heading{
    text-align: center;
    padding: 0;
    }
.contactos form .inputcaja{
    position: relative;
}

.contactos form .inputcaja input, .contactos form .btnimputcaja textarea{
    width: 100%;
 
    background: black;
    margin: 1.5rem 0;
    padding: .5rem 0;
    font-size: 1.7rem;
        }

        .contactos form .inputcaja label{
            font-family: 'Poppins', sans-serif;
        }



.legal a{
 
    color: #4682B4;
    text-decoration: underline;
    font-family: 'Poppins', sans-serif;
  
  
}

.legal br{
    text-align: center;

}

.footer{
    padding-top: 3rem;
    background: url(/images/img_movicenter/footer-fondo.png) no-repeat;
background-size: cover;
background-position: center;

}

.footer .caja-contenedor{
display: flex;
flex-wrap: wrap;

}
.footer .caja-contenedor .caja{
     flex: 1 1 25rem;
  
}
.footer .caja-contenedor .caja h3{
    font-size: 1.5rem;
    padding: 1rem 0;
    color: wheat;
    text-decoration: underline;
    text-underline-offset: 1rem;
    }
.footer .caja-contenedor .caja p{
    font-size: 1rem;
    padding: .5rem 0;
    color:whitesmoke
}

.footer .caja-contenedor .caja a{

     display: block;
     font-size: 1rem;
     padding: .5rem 0;
     color: wheat;
}

.footer .caja-contenedor .caja a{
    text-decoration: underline;
}

.footer .caja-contenedor .caja .info{
     display: flex;
     align-items: center;

     }
     
.footer .caja-contenedor .caja .info i{
    margin: 5rem 0;
    margin-right: 1rem;
    border-radius: 50%;
    background: whitesmoke;
       font-size: 1.8rem;
    height: 4.5rem;
    width: 4.5rem;
    line-height:  4.5rem;
    text-align: center;
}

.footer .creditos{
    font-size: 1rem;
    font-weight: normal;
    letter-spacing: .2rem;
    color:wheat;
    border-top: .1rem solid wheat;
    padding: 2.5rem 1rem;
    text-align: center;


}

div.fotos {
    text-align: center;
    width: 80%;
    display: block;
  margin: auto;
    padding: 0.5rem;
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
  }
  img {
    width: 100%;
    display: block;
    margin: auto;
  
  
  }
  div.contenedor {
   text-align: center;
    padding: 10px 20px; 
  }
 





@media(max-width:1200px){
    html{
        font-size: 55%;
    }
}
            @media(max-width:768px){
                header label{
                    visibility: visible;
                    opacity: 1;
                }
                header .navbar{
                    position: absolute;
                    top: 100%;
                    left: 0;
                    width: 100%;
                    background-color: white;
                   padding: 1rem 2rem;
                   border-top: .1rem solid rgba(0, 0, 0, .2);
                    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1);
                    transform-origin: top;
                    transform: scaleY(0);
                    opacity: 0;

                }
                header .navbar a{
                    display: block;
                    margin: 2rem 0;
                    font-size: 2rem;
                }
               header input:checked ~ .navbar{
                    transform: scaleY(1);
                    opacity: 1;         
                            }
                        
                            header input:checked ~ label::before{
                                content: '\f00d';
                            }



            }
            .inicio{
                flex-flow: column-reverse;
            }
            .inicio .content h3{
                font-size: 3.6rem;
            }
.inicio .content p{
    font-size: 1.5rem;
}


@media(max-width:450px){
    html{
        font-size: 49%;

    }
   
    
}