html {
            font-family: 'Roboto', sans-serif;
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust:     100%;
            box-sizing: border-box;
        }

        body {
            margin: 64px auto;
        	color: white;
            font-size: 16px;
            font-size: 1rem;
            line-height: 1.5;
            background: #000;
        }

        
        
        /*
        # Responsividade
        */

        @media screen and (max-width: 900px) {

            .site-content {
                max-width: 100%;
                margin: 0 auto;
            }

            .site-footer {
                max-width: 500px;
                margin: 0 auto;
            }

            #coluna-esq {
                    float: none;
                width: 100%;
                margin: 0 auto;
                text-align: center;
            }

            #coluna-dir {
                    float: none;
                width: 100%;
                margin: 0 auto;
                height: 0;
                clear: both;
            }

            #rodape-esq,
            #rodape-dir {
                max-width: 50%;
                margin: 0;
            }

            .main-navigation {
                float: none;
                max-width: 500px;
                margin: 0 auto;

            }

            .main-navigation li {
                font-size: 95%;
                text-align: right;
            }

            .pos-footer {
                max-width: 500px;
                margin: 64px auto;
                text-align: right;

            }

            .logo-cenografa,
            .logo-arquiteta {
                max-width: 50%;
            }

            .logo-cenografa img,
            .logo-arquiteta img {
                max-width: 100%;
            }


        }
        

    .site-info {
        display: none;
    }

    
    .site-content {
        max-width: 1020px;
        width: 100%;
        margin: 0 auto;
        overflow: auto;
    }

    #coluna-esq {
        margin: 0 20px 0 0;
        float: left;
        max-width: 500px;
        width: 100%;

    }

    #coluna-dir {
        margin: 0;
        float: left;
        max-width: 500px;
        width: 500px;
        max-height: 500px;
        height: 500px;
        font-size: 75%;
        display: table;
    }

    .site-footer {
        max-width: 1020px;
        width: 100%;
        margin: 24px auto;
        overflow: auto;
        clear: both;
    }

    #rodape-esq {
        margin: 0 20x 0 0;
        float: left;
        max-width: 500px;
        width: 100%;
    }

    
    #rodape-dir {
        max-width: 500px;
        width: 100%;
        float: left;
    }

    .logo-cenografa,
    .logo-arquiteta {
        margin: 0 auto;
        max-width: 120px;
    }
    
    .logo-cenografa img,
    .logo-arquiteta img {
            max-width: 120px;
    }

    .pos-footer {
        max-width: 1020px;
        width: 100%;
        margin: 0 auto;
        text-align: right;

    }    
    
    /*--------------------------------------------------------------
    # Accessibility
    --------------------------------------------------------------*/
    /* Texto significativo apenas para leitores-de-texto. */
    .screen-reader-text {
        clip: rect(1px, 1px, 1px, 1px);
        position: absolute !important;
        height: 1px;
        width: 1px;
        overflow: hidden;
    }

    .screen-reader-text:hover,
    .screen-reader-text:active,
    .screen-reader-text:focus {
        background-color: #f1f1f1;
        border-radius: 3px;
        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
        clip: auto !important;
        color: #21759b;
        display: block;
        font-size: 14px;
        font-size: 0.875rem;
        font-weight: bold;
        height: auto;
        left: 5px;
        line-height: normal;
        padding: 15px 23px 14px;
        text-decoration: none;
        top: 5px;
        width: auto;
        z-index: 100000;
    }