/*
 * Mecada web index stylesheet
 * 
 * Mauricio Del Solar
 * mdsr.pro@gmail.com
 *
 * Copyright ©2013
 */

body {
    background: transparent url(../img/index_bg.jpg) no-repeat center center;
    background-attachment: fixed;
    background-size: cover;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

#header {
    margin-top: 3.125em; /* 50/16 */
    width: 100%;
    height: 6.25em; /* 100/16 */
    background: transparent url(../img/header_footer_bg.png) top left;
}

#header img {
    margin: 1.5625em 0 0 3.125%; /* 25/16, 30/960 */
}

#menu {
    margin: 5.35714285714286em 3.125% 0 0; /* 75/14, 30/960 */
}

#footer {
    background: transparent url(../img/header_footer_bg.png) top left;
    text-align: center;
}


@media screen and (max-width: 500px) {
    #header {
        margin: 0;
        height: 7.5em; /* 120/16 */
        text-align: center;
    }

    #menu {
        float: none;
        margin: 0.55555555555556em 0; /* 10/18 */
        font-size: 1.125em; /* 18/16 */
    }

    #footer {
        height: 3.75em; /* 60/16 */
    }

    #footer p {
        line-height: 0.875em; /* 14/16 */
    }

    #social-network {
        position: static;
        margin: 0.625em 0 0.3125em; /* 10/16, 5/16 */

    }
}

@media screen and (max-width: 400px) {
    #header {
        height: 9.375em; /* 150/16 */
    }

    #header img {
        width: 280px;
    }

    #menu li {
        border: none;
        display: list-item;
        font-size: 1.25em; /* 20/16 */
        line-height: 1.375em; /* 22/16 */
    }
}