@font-face {
    font-family: 'Aldo-SemiBold';
    src:url('Aldo-SemiBold.ttf.woff') format('woff'),
        url('Aldo-SemiBold.ttf.svg#Aldo-SemiBold') format('svg'),
        url('Aldo-SemiBold.ttf.eot'),
        url('Aldo-SemiBold.ttf.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

body {
    background-color: #162038;
    font-size: 10pt;
}

#cuerpo {
    width: 100%;
}

#footer {
    background-color: #122335;
    width: 100%;
    color: white;
    text-align: center;
    font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
    line-height: 23px;
    letter-spacing: 2px;
    font-style: italic;
    font-size: 10pt;
    padding: 15px 0 15px 0;
}

#titulo_contacto {
    color: #0e5376;
    font-weight: bold;
}

#mensaje {
	font-family: "Aldo-SemiBold";
    background-color: #0e1927;
    padding: 25px 0 25px 0;
    text-align: center;
	color: white;
    line-height: 25px;
}

#mensaje_tablet {
    font-family: "Aldo-SemiBold";
    color: white;
    text-align: center;
    width: 50%;
}

#mensaje .titulo {
    font-size: 13pt;
}

#mensaje_tablet .titulo {
    font-size: 18pt;
    line-height: 40px;
}

#mensaje .nombre {
    font-size: 18pt;
    color: #b53a50;
}

#mensaje_tablet .nombre {
    font-size: 24pt;
    color: #b53a50;
    line-height: 40px;
}

#mensaje .musica {
    font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
    font-size: 6pt;
    font-style: italic;
    padding-top: 10px;
}

#mensaje_tablet .musica {
    font-family: Arial,Helvetica Neue,Helvetica,sans-serif;
    font-size: 8pt;
    font-style: italic;
    padding-top: 40px;
    line-height: 30px;
}

#mensaje_tablet .detalle {
    font-size: 16pt;
    line-height: 25px;
}

.red_musica {
    border: 1px solid #0e5376;
    width: 52px;
    height: 20px;
    padding-top: 2px;
    display: inline-block;
    margin-left: 3px;
}

#itunes {
    background: url("itunes-mobile.png") no-repeat;
    background-position: center;
}

#music {
    background: url("music-mobile.png") no-repeat;
    background-position: center;
}

#spotify {
    background: url("spotify-mobile.png") no-repeat;
    background-position: center;
}

#deezer {
    background: url("deezer-mobile.png") no-repeat;
    background-position: center;
}

.musica a {
    border: 0px;
}

#header {
    background-image: url('alejo-mobile.png');
    background-position: right top;
    background-repeat: no-repeat;
    width: 100%;
    height: 240px;
}

#logo {
    width: 252px;
    height: 120px;
    background-repeat: no-repeat;
    padding: 60px 0 0 10px;
    background-image: url('logo-mobile.png');
    background-position: left center;
}

#redes_mobile {
    width: 95px;
    height: 28px;
    border: 1px solid #005a7a;
    margin-left: 10px;
    padding: 2px 5px;
}

#redes_mobile img {
    padding: 5px 3px;
}

#footer_redes,
#mensaje_tablet {
    display: none;
}

#redes_mobile,
#mensaje {
    display: block;
}

#footer_redes {
    width: 50%;
    float: left;
}



/* Tablet */
@media only screen and (min-width: 780px) {

    #redes_mobile {
        display: none;
    }

    #header {
        background-image: url('alejo-tablet.png');
        height: 445px;
    }

    #logo {
        background-image: url('logo-tablet.png');
        background-position: center center;
        width: 50%;
    }

    #redes_mobile,
    #mensaje {
        display: none;
    }

    #footer_redes,
    #mensaje_tablet {
        display: block;
    }

    #contacto {
        width: 50%;
    }

    #titulo_contacto,
    #datos_contacto {
        width: 50%;
        float: left;
    }

    #titulo_contacto {
        padding-top: 20px;
    }

    #redes_tablet {
        border: 1px solid #005a7a;
        margin-top: 20px;
        width: 160px;
        height: 32px;
        margin-left: auto;
        margin-right: auto;
        padding-top: 5px;
    }

    #redes_tablet img {
        padding: 5px 10px;
    }

    #footer {
        height: 90px;
    }
}


@media only screen and (min-width: 475px) {

    #logo {
        background-image: url('logo-tablet.png');
        background-position: center center;
    }

    #redes_mobile {
        margin-left: 80px;
    }
}


@media only screen and (min-width: 1000px) {

    #header {
        background-image: url('alejo-full.png');
        height: 610px;
    }

    #logo {
        background-image: url('logo-full.png');
        background-position: center center;
        width: 50%;
        height: 200px;
        padding-top: 150px;
    }

    #mensaje_tablet .titulo {
        font-size: 24pt;
    }

    #mensaje_tablet .nombre {
        font-size: 28pt;
    }

    #mensaje_tablet .detalle {
        font-size: 18pt;
        line-height: 35px;
    }
}