main
{
    margin-top: 3.5em;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    font-size: 20px;
    font-family: 'Libre Franklin', sans-serif;
}
#logo-head
{
    margin-bottom:1.6em;
    width: 3.5em;
}
main h1
{
    margin-top: 0;
    font-weight: 300;
    color: hsl(0, 0%, 59%);
    margin-bottom: .25em;
}
.black
{
    font-weight: 700;
    color: hsl(209, 33%, 12%);
}
main p
{
    margin-top: 0;
    font-weight:300;
    color: hsl(208, 31%, 12%);
    font-size: .85em;
    margin-bottom: 0;
}
#subscribe
{
    display: flex;
    flex-direction: column;
    margin-top: 1.3em;
}
.email-style
{
    box-sizing: border-box;
    border: .1em solid rgba(150, 150, 150, 0.2);
    border-radius: 3em;
    width: 25em;
    height: 3.5em;
    padding: .8em 1.5em;
    margin-right: .7em;
}
.email-style:hover
{
    border: .1em solid hsl(223, 87%, 63%);
}
.email-style:focus
{
    outline: hsl(223, 100%, 88%);
    border: .15em solid hsl(223, 87%, 63%);
}
.email-style::placeholder
{
    color: rgba(150, 150, 150, 0.3);
}
.red-border
{
    border: .10em solid hsl(354, 100%, 66%);
}
#notify
{
    box-sizing: border-box;
    background-color: hsl(223, 87%, 63%);
    color: white;
    width: 14em;
    height: 3.5em;
    font-weight: 300;
    font-size: .6em;
    border: 0;
    border-radius: 3em;
    padding: .8em 3em;
}
#notify:hover
{
    background-color: hsla(223, 87%, 63%, 0.750);
}
main #error
{
    margin-top: 1em;
    font-size: .5em;
    color: hsl(354, 100%, 66%);
    font-style: italic;
    margin-bottom: 4em;
    margin-left: 2em;
}
#main-img
{
    width: 23em;
}
.social-icon
{
    width :.55em;
    height: .55em;
    color: hsl(223, 87%, 63%);
    border: .01em solid hsla(0, 0%, 59%, 0.155);
    border-radius: 50%;
    padding: .2em;
    margin-right: .3em;
    margin-top: 2.4em;
}
.social-icon:hover
{
    background-color: hsl(223, 87%, 63%);
    color: white;
}
footer
{
    margin-top: 1.3em;
    font-weight: 300;
    font-size: .5em;
    color : hsl(0, 0%, 59%);
}
@media screen and (max-device-width:480px)
{
    main
    {
        margin-top: 5.3em;
        font-size: 12px;
    }
    #logo-head
    {
        width: 5em;
        margin-bottom: 3.5em;
    }
    main h1
    {
        margin-bottom: .7em;
    }
    main p
    {
        margin-bottom: 2em;
    }
    #subscribe
    {
        justify-content: center;
        align-items: center;
    }
    #email-notify-container
    {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
    }
    .email-style
    {
        font-size: 1em;
        height: 3em;
        width: 24em;
        margin-bottom: .6em;
        margin-right: 0;
    }
    #notify
    {
        font-size: 1em;
        border-radius: 3em;
        padding: .8em 1.5em;
        height: 3em;
        width: 24em;
        margin-bottom: .4em;
    }
    main #error
    {
        margin: 1em 0 4em;
        font-size: .8em;
    }
    #main-img
    {
        width: 27.5em;
        margin-bottom: 0em;
    }
    .social-icon
    {
        box-sizing: border-box;
        width: 1.4em;
        height: 1.4em;
        margin-right: .6em;
        padding: .5em;
        margin-bottom: 1em;
    }
    footer
    {
        font-size: 10px;
        margin-bottom: 2.5em;
    }
}