﻿*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
	background-image: url(../../../img/fondo_rock.png);
	background-size: 100vw 100vh;
	background-attachment: fixed;
}

::-webkit-scrollbar{
    display: none;
}

.suscripcion{
    margin: auto;
    display: block;
    width: 100%;
}

.suscribe_title{
    margin: .3125rem auto;
    width: 100%;
    color: #e1e1e1;
    font-size: 2rem;
    text-shadow: -1px -2px 1px black;
    text-align: center;
    padding: 10px;
}

.correo{
    margin: .625rem auto .3125rem;
    display: block;
    width: 100%;
    max-width: 20rem;
    background: linear-gradient(to right, #000, #0d0d0d, #343e63, #345363, #0d0d0d, #000);
    color: #fff;
    text-align: center;
    text-shadow: -1px -1px 1px black;
    font-size: 1rem;
    padding: .625rem .3125rem;
    border: none;
}

.correo:hover{
    box-shadow: 0 0 .25rem #bbbbbb;
}

.btn_sub{
    margin: auto;
    display: block;
    width: 100%;
    max-width: 15rem;
    padding: .625rem;
    background: linear-gradient(to bottom, rgba(0,0,0,.5), rgba(41,132,96,.75), rgba(0,0,0,.5));
    color: #fff;
    font-size: 1rem;
    text-shadow: -1px -2px 1px black;
    border: none;
	transition: all 0.5s;
    cursor: pointer;
}

.btn_sub:hover{
	transform: scale(1.0625);
}

@media (max-width: 599px){
    .suscribe_title{
        font-size: 1.375rem;
    }
    .correo{
        width: 100%;
    }
    .btn_sub{
        width: 100%;
    }
}

@media (max-width: 767px) and (min-width: 600px){
    .contenedor .img{
        max-width: 35%;
        margin: 2% auto;
    }
    .año{
        max-width: 125px;
        font-size: 2.25rem;
    }
}

@media (max-width: 950px) and (min-width: 768px){
    .contenedor .img{
        max-width: 50%;
        margin: 1.5% auto;
    }
    .año{
        max-width: 130px;
        font-size: 2.375rem;
    }
}

@media (max-width: 1199px) and (min-width: 951px){
    .contenedor .img{
        max-width: 50%;
        margin: 1% auto;
    }
    .año{
        max-width: 135px;
        font-size: 2.5rem;
    }
}

@media (min-width:1200px){
    body{
        margin: 0 auto 4.5%;
    }
    .contenedor .img{
        max-width: 50%;
        margin: 1% auto;
    }
    .año{
        max-width: 140px;
        font-size: 2.75rem;
    }
}