/*
 * Author: Carlos Alvarez
 * URL: http://Alvarez.is
 *
 * Project Name: NYC Design
 * Version: 1.0
 * Date: 04-20-2014
 * URL: 
 */
            /* ==========================================================================
   Base Styles, Bootstrap Modifications & Fonts Import
   ========================================================================== */
            
            @import url(http://fonts.googleapis.com/css?family=Oswald:400,300,700);
            @import url(http://fonts.googleapis.com/css?family=Lato:400,700);
            html,
            button,
            input,
            select,
            textarea {
                color: #222;
            }
            /*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
            
             ::-moz-selection {
                background: #f2c2c9;
                color: #a4003a;
                text-shadow: none;
            }
            
             ::selection {
                background: #16a085;
                color: #a4003a;
                text-shadow: none;
            }
            /*
 * A better looking default horizontal rule
 */
            
            hr {
                display: block;
                height: 1px;
                border: 0;
                border-top: 1px solid #ccc;
                margin: 1em 0;
                padding: 0;
            }
            
            .centered {
                text-align: center
            }
            /* ==========================================================================
   General styles
   ========================================================================== */
            
            html,
            body {
                height: 100%;
            }
            
            body {
                font-family: "Lato" sans-serif;
                font-weight: 400;
                font-size: 16px;
                color: #000;
                -webkit-font-smoothing: antialiased;
                -webkit-overflow-scrolling: touch;
            }
            
            h1,
            h2,
            h3,
            h4,
            h5,
            h6 {
                font-family: "Oswald", sans-serif;
                font-weight: 300;
            }
            
            p {
                color: #909090;
            }
            
            h3 {
                color: #e3152f;
            }
            /* ==========================================================================
   MENU CONFIGURATION
   ========================================================================== */
            
            .menu {
                position: fixed;
                right: -200px;
                width: 260px;
                height: 100%;
                top: 0;
                z-index: 10;
                text-align: left;
            }
            
            .menu.menu-open {
                right: 0px;
            }
            
            .menu-wrap {
                position: absolute;
                top: 0;
                left: 60px;
                /* background: #1a1a1a; */
                background: #909090;
                width: 200px;
                height: 100%;
            }
            
            .col-md-6 h2 {
                color: #e3152f;
            }
            
            .col-md-6 p {
                color: #909090;
            }
            
            .centered h1 {
                color: #e3152f;
            }
            
            .centered p {
                color: #909090;
            }
            
            .menu h1.logo a {
                font-family: "Oswald", sans-serif;
                font-size: 16px;
                font-weight: 700;
                letter-spacing: 0.15em;
                line-height: 40px;
                text-transform: uppercase;
                color: #ffffff;
                margin-top: 20px;
            }
            
            .menu h1.logo a:hover {
                color: #f85c37;
            }
            
            .menu img.logo {
                margin: 20px 0;
                max-width: 160px;
            }
            
            .menu a {
                margin-left: 20px;
                /* color: #808080; */
                color: #fff;
                display: block;
                font-size: 12px;
                font-weight: 700;
                line-height: 40px;
                letter-spacing: 0.1em;
                text-transform: uppercase;
            }
            
            .menu a:hover {
                color: #ffffff;
            }
            
            .menu a:active {
                color: #ffffff;
            }
            
            .menu a>i {
                float: left;
                display: inline-block;
                vertical-align: middle;
                text-align: left;
                width: 25px;
                font-size: 14px;
                line-height: 40px;
                margin: 25px 2px;
            }
            
            .menu-close {
                cursor: pointer;
                display: block;
                position: absolute;
                font-size: 14px;
                /* color: #808080; */
                color: #e3152f;
                width: 40px;
                height: 40px;
                line-height: 40px;
                top: 20px;
                right: 5px;
                -webkit-transition: all .1s ease-in-out;
                -moz-transition: all .1s ease-in-out;
                -ms-transition: all .1s ease-in-out;
                -o-transition: all .1s ease-in-out;
                transition: all .1s ease-in-out;
            }
            
            .menu-close:hover {
                color: #ffffff;
                -webkit-transition: all .1s ease-in-out;
                -moz-transition: all .1s ease-in-out;
                -ms-transition: all .1s ease-in-out;
                -o-transition: all .1s ease-in-out;
                transition: all .1s ease-in-out;
            }
            /* Push the body after clicking the menu button */
            
            .body-push {
                overflow-x: hidden;
                position: relative;
                left: 0;
            }
            
            .body-push-toright {
                left: 200px;
            }
            
            .body-push-toleft {
                left: -200px;
            }
            
            .menu,
            .body-push {
                -webkit-transition: all .3s ease;
                -moz-transition: all .3s ease;
                -ms-transition: all .3s ease;
                -o-transition: all .3s ease;
                transition: all .3s ease;
            }
            
            #menuToggle {
                position: absolute;
                top: 20px;
                left: 0;
                z-index: 11;
                display: block;
                text-align: center;
                font-size: 14px;
                color: #ffffff;
                width: 40px;
                height: 40px;
                line-height: 40px;
                cursor: pointer;
                background: rgba(0, 0, 0, 0.25);
                -webkit-transition: all .1s ease-in-out;
                -moz-transition: all .1s ease-in-out;
                -ms-transition: all .1s ease-in-out;
                -o-transition: all .1s ease-in-out;
                transition: all .1s ease-in-out;
            }
            
            #menuToggle:hover {
                color: #ffffff;
                background: rgba(0, 0, 0, 0.2);
                -webkit-transition: all .1s ease-in-out;
                -moz-transition: all .1s ease-in-out;
                -ms-transition: all .1s ease-in-out;
                -o-transition: all .1s ease-in-out;
                transition: all .1s ease-in-out;
            }
            /* ==========================================================================
   Wrap Sections
   ========================================================================== */
            
            #headerwrap {
                background: url(../img/portada4.jpg) no-repeat center top;
                margin-top: 0px;
                padding-top: 120px;
                text-align: center;
                background-attachment: relative;
                background-position: center center;
                min-height: 700px;
                width: 100%;
                -webkit-background-size: 100%;
                -moz-background-size: 100%;
                -o-background-size: 100%;
                background-size: 100%;
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
            }
            
            #headerwrap h1 {
                color: #ffffff;
                margin-top: 90px;
                padding-bottom: 30px;
                letter-spacing: 8px;
                font-size: 100px;
                font-weight: bold;
                text-shadow: 2px 2px 2px #000;
            }
            /* About Wrap & Conf */
            
            #aboutwrap {
                margin-top: 80px;
                margin-bottom: 80px;
            }
            
            .name {
                text-align: center;
            }
            
            .name p {
                font-size: 22px;
                font-weight: lighter;
                margin-top: 15px;
                letter-spacing: 2px;
            }
            
            .name-label {
                width: 60px;
                height: 60px;
                margin: 0 auto 45px;
                border-top: 1px solid #000;
                background: url(../img/name-label.png) center bottom no-repeat;
                background-size: 35px 35px;
            }
            
            .name-zig {
                width: 73px;
                height: 17px;
                margin: 38px 0 38px;
                background: url(../img/name-zig.png) 0 0 no-repeat;
                background-size: 73px 17px;
            }
            
            .name-desc h2 {
                font-family: 'Oswald', sans-serif;
                font-size: 40px;
                line-height: 1.45;
                font-weight: 300;
                color: #909090;
            }
            
            .name-desc .labels {
                color: #e3152f;
            }
            /* Separator About - Parallax Section */
            
            .sep {
                background-attachment: fixed;
                background-position: 50% 0;
                background-repeat: no-repeat;
                height: 450px;
                position: relative;
            }
            
            .about {
                background-image: url(../img/about.jpg);
            }
            /* Portfolio Wrap Section */
            
            #portfoliowrap {
                display: block;
                margin-top: 80px;
                margin-bottom: 80px;
            }
            
            #portfoliowrap h1 {
                font-weight: 300;
                text-align: center;
                margin-bottom: 50px;
            }
            
            .mt {
                margin-top: 50px;
            }
            
            .mb {
                margin-bottom: 60px;
            }
            
            #portfoliowrap i {
                font-size: 50px;
                color: #e3152f;
            }
            
            .proc {
                padding-top: 15px;
                padding-bottom: 15px;
                border-bottom: solid 2px transparent;
            }
            
            .proc h3 {
                color: #proc;
            }
            
            #portfoliowrap .proc:hover {
                background-color: #eee;
                border-bottom: solid 2px #2f2f2f
            }
            
            .portfolio {
                background-image: url(../img/porta.jpg);
            }
            /* Service Wrap */
            
            #servicewrap {
                display: block;
                margin-top: 80px;
                margin-bottom: 80px;
            }
            
            #servicewrap h1 {
                font-weight: 300;
                text-align: center;
                margin-bottom: 20px;
            }
            
            .service {
                text-align: left;
            }
            
            .service small {
                font-size: 12px;
                font-weight: bold
            }
            
            .service i {
                float: left;
                margin-right: 15px;
                font-size: 30px;
                vertical-align: middle;
            }
            
            .service .text {
                color: #767676
            }
            /* Testimonials Wrap */
            
            #testimonials {
                display: block;
                margin-top: 80px;
                margin-bottom: 80px;
                background-color: #f3f3f3;
            }
            /* Contact Wrap */
            
            #contactwrap {
                background-color: #2f2f2f;
                margin-top: 0px;
                padding-top: 25px;
                padding-bottom: 25px;
            }
            
            #contactwrap p {
                color: #f2f2f2;
            }
            
            #contactwrap small {
                font-size: 13px;
                text-transform: uppercase;
            }
            
            #contactwrap small a {
                text-transform: lowercase;
                color: #e3152f;
            }
            
            .contact {
                background-image: url(../img/contacto3.jpg);
            }
            
            #contactwrap label {
                color: #f2f2f2;
                margin-top: 10px;
            }
            /* Gallery Configuration */
            
            .photo-wrapper {
                display: block;
                position: relative;
                overflow: hidden;
                background-color: #2f2f2f;
                -webkit-transition: background-color 0.4s;
                -moz-transition: background-color 0.4s;
                -o-transition: background-color 0.4s;
                transition: background-color 0.4s;
            }
            
            .project .overlay {
                position: absolute;
                text-align: center;
                color: #fff;
                opacity: 0;
                filter: alpha(opacity=0);
                -webkit-transition: opacity 0.4s;
                -moz-transition: opacity 0.4s;
                -o-transition: opacity 0.4s;
                transition: opacity 0.4s;
            }
            
            .project:hover .photo-wrapper {
                background-color: #2f2f2f;
                background-image: url(../img/zoom.png);
                background-repeat: no-repeat;
                background-position: center;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                position: relative;
            }
            
            .project:hover .photo {
                opacity: 10;
                filter: alpha(opacity=4000);
                opacity: 0.1;
                filter: alpha(opacity=40);
            }
            
            .project:hover .overlay {
                opacity: 100;
                filter: alpha(opacity=10000);
                opacity: 1;
                filter: alpha(opacity=100);
            }
            
            .desc {
                margin-top: 25px;
            }
            
            .logo2 {
                position: absolute;
                margin-top: 23px;
                width: 250px;
                margin-left: -11px;
            }