body{
	margin:0;
	padding:0;
	background:#FFFFFF;
    color:#1A1826;
    font-family: 'Montserrat', sans-serif;
}

.light-grey{
    background:#F3F3F3;
}

.white{
    background:#fff;
}

.color-white{
    color:#fff;
}

.grey{
    background:#232323;
}

.red{
    background:#AF0C14;
}

.color-red{
    color:#AF0C14;
}

.color-white{
    color:#fff;
}

.color-black{
    color:#000;
}

.color-grey{
    color:#919094;
}

.top{
    vertical-align:top;
}

.middle{
    vertical-align:middle;
}





h1{
   font-size:30px; 
}

h2{
    font-size:35px;
    font-weight:600;
}

h3{
    font-size:25px;
    font-weight:700;
}

h4{
    font-size:15px;
    font-weight:400;
}

p{
    font-size:14px;
}

a{
    text-decoration:none;
}

.exo{
    font-family: 'Exo 2', sans-serif;
}


header, nav{
    background:#fff;
    display: block;
}

header{
    background:#fff;
    height:80px;
    position: relative;
    z-index: 2;
}

#logo{
    background: url(../img/logo.png) no-repeat 0 0;
    display: block;
    float: left;
    margin: 10px 0px 0px 20px;
    width: 200px;
    height: 70px;
    text-indent: -9999px;
    font-family: 'Titillium Web', sans-serif;
}

#menu{float: right;}   

#menu ul{
    list-style: none;
    font-size: 14px;
}
        
#menu li{
    display: block;
    float: left;
    text-align: center;
}

#menu li a{
    font-size:13px;
    font-weight:400;
    display: block;
    color: #AF0C14;
    font-weight:700;
    text-decoration: none;
    height: 80px;
    line-height: 70px;
    padding: 0 17px;
}

#menu li a:hover{
    background: #AF0C14;
    color: #fff;
}
  
#nav-mobile{
    display: none;
    background: url(../img/nav.png) no-repeat center center;
    float: right;
    width: 60px;
    height: 70px;
    position: absolute;
    right: 0;
    top:0;
    opacity: 1;
}

#nav-mobile.nav-active{
    opacity: .5;
}


.back-index img{
    left:0;
    top:10;
    width: 100%;
    max-width:100%;
    z-index: -9999;
    position:absolute;
}

.index{
    padding:250px 0px;
    width:auto;
    padding-left:50px;
}

.index h1{
    font-size:45px;
    padding:0px 20px;
    font-weight:800;
}


.conocenos{
    width:100%;
    margin-top:-15px;
}

.conocenos h2{
    font-size:65px;
    padding:100px 0px;
    width:100%;
}

.conocenos h3{
    margin-left:50px;
    padding:10px 0px;
}

.conocenos img{
    width:25px;
    vertical-align:middle;
    margin-left:-30px;
}

.conocenos p{
    font-size:18px;
    margin-left:50px;
    vertical-align:middle;
}

.btn a{
    background:#F3F3F3;
    border:2px solid #AF0C14;
    margin-left:50px;
    padding:5px 10px;
    color:#AF0C14;
    border-radius:5px;
    letter-spacing:1px;
}

.btn a:hover{
    background:#AF0C14;
    border:1px solid #F3F3F3;
    margin-left:50px;
    padding:5px 10px;
    color:#fff;
    border-radius:5px;
    -webkit-transition: background 1s ease;
    -moz-transition: background 1s ease;
    -ms-transition: background 1s ease;
    -o-transition: background 1s ease;
    transition: background 1s ease;
}

.btn-red{
    margin-top:30px;
}

.btn-red a{
    background:#AF0C14;
    border:2px solid #AF0C14;
    text-align:center;
    padding:5px 10px;
    color:#fff;
    border-radius:5px;
    letter-spacing:1px;
}

.btn-red a:hover{
    background:#fff;
    border:1px solid #F3F3F3;
    padding:5px 10px;
    color:#AF0C14;
    border-radius:5px;
    -webkit-transition: background 1s ease;
    -moz-transition: background 1s ease;
    -ms-transition: background 1s ease;
    -o-transition: background 1s ease;
    transition: background 1s ease;
}

#proyectos{
    text-align:left;
}

#proyectos img{
    width:90%;
    padding:10px;
}

#proyectos img:hover{
    background:#F3F3F3;
    width:90%;
    padding:10px;
    -webkit-transition: background 1s ease;
    -moz-transition: background 1s ease;
    -ms-transition: background 1s ease;
    -o-transition: background 1s ease;
    transition: background 1s ease;
}

#proyectos h2{
    text-align:center;
}

#proyectos h3{
    font-weight:600;
    font-size:18px;
    padding-left:10px;
}

#proyectos p{
    font-size:13px;
    font-weight:400;
}


/* URBANIZACION */
#urbanizacion{
    width:100%;
}

#urbanizacion-txt{
    padding:50px 80px;
}

#urbanizacion-txt h1{
    font-size:45px;
    padding:20px 0px;
    color:#AF0C14;
}
.urbanizacion img{
    width:100%;
    float:right;
    margin:0px -45px -3px 0px;
}

/* URBANIZACION */
/*F O O T E R*/


#footer{
    padding:20px 0px;
}


footer h3{
    font-weight:600;
    font-size:18px;
    padding:5px 0px;
}
        

footer p{
    padding:5px 0px;
}

footer span{
    color:#AF0C14;
    font-size:18px;
}


footer a{
    color:#232323;
    font-size:13px;
}

::-webkit-input-placeholder{
    color:#AF0C14;
    font-size:14px;
    text-align:left;
    letter-spacing:1px;
}

.footer-top{
    width:90%;
}

.footer-top input[type="email"]{
    background:#F3F3F3;
    border:1px solid #AF0C14;
    margin-top:10px;
    padding:10px 5px;
    padding-left:10px;
    font-size:14px;
    color:#fff;
    border-radius:4px;
}

.footer-top input[type="email"]:focus{
    background:none;
    color:#fff;
    font-size:14px;
}

.footer-top input[type="submit"]{
    background:#AF0C14;
    border:none;
    margin-top:5px;
    padding:11px 0px;
    font-size:14px;
    letter-spacing:2px;
    color:#fff;
    cursor:pointer;
    border-radius:4px;
    width:95.5%;
}


.footer-top input[type="submit"]:hover{
    background:#232323;
    color:#fff;
    -webkit-transition: background 2s ease-out;
    -moz-transition: background 2s ease-out;
    -ms-transition: background 2s ease-out;
    -o-transition: background 2s ease-out;
    transition: background 2s ease-out;
}


.footer-top2 span{
    color:#AF0C14;
    background:none;
    padding-right:10px;
    border:none;
}

.footer-footer{
    margin-left:20px;
}

.footer-footer span{
    background:#C40505;
    padding:10px 10px;
    color:#fff;
}

.footer-footer span:hover{
    background:#232323;
    -webkit-transition: background 2s ease-out;
    -moz-transition: background 2s ease-out;
    -ms-transition: background 2s ease-out;
    -o-transition: background 2s ease-out;
    transition: background 2s ease-out;
}



/* CONTACTO */
.formulario{
    width:100%;
}

.formulario input[type="email"], .formulario input[type="tel"], .formulario input[type="text"], .formulario textarea{
    background:#fff;    
    font-size:15px;
    padding:10px 0px;
    margin:10px 0px;
    width:100%;
}

.formulario input[type="email"]:focus, .formulario input[type="tel"]:focus, .formulario input[type="text"]:focus, .formulario textarea:focus{
    background:#fff;
    color:#232323;
    text-align:left;
}

.formulario input[type="submit"] {
    background:#C40505;
    color:#fff;
    font-size:17px;
    width:100%;
    padding:15px;
    border-radius:2px;
    border:none;
    margin-top:10px;
    border-bottom:2px solid #fff;
    font-weight:500;    
}

.formulario input[type="submit"]:hover {
    background:#fff;
    color:#232323;
    cursor:pointer;
}

.formulario textarea{
    resize:none;
    width:100%;
}

.formulario form{
    width:100%;
}

.formulario ::-webkit-input-placeholder{
    font-family: 'Raleway', sans-serif;
    color:#AAA;
    font-size:14px;
    text-align:left;
    padding:0px 5px;
}

.maps{
    width:80%;
    padding:10px;
    margin-top:20px;
}

.maps iframe{  
    width:100%;
    height:300px;
}

.formulario p{
    width:100%;
    padding:5px 0px;
}

.formulario span{
    font-size:18px;
    color:#C40505;
    padding:5px;
}

.formulario a{
    color:#1A1826;
}
.formulario h1{
    font-size:35px;
    font-weight:700;
}

#video{
      
}

#video iframe{
    border:1px solid #fff;
    padding:10px;
    margin-top:40px;
    width:85%;
    height:320px;
}





/* #Media Queries  */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
        #logo{
            background: url(../img/logo.png) no-repeat 0 0;
            display: block;
            float: left;
            margin: 15px 0px 0px 5px;
            width: 190px;
            height: 77px;
            text-indent: -9999px
        }

        

        #menu li a{
            font-size:13px;
            padding: 0 10px;
        }

        
    }

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
#proyectos img {
    width: 100%;
    padding: 10px;
}
#proyectos img:hover{
    background:#F3F3F3;
    width:100%;
    padding:10px;
    -webkit-transition: background 1s ease;
    -moz-transition: background 1s ease;
    -ms-transition: background 1s ease;
    -o-transition: background 1s ease;
    transition: background 1s ease;
}
		/* mostramos #nav-mobile */
    #nav-mobile{
        display: block;
        margin:20px;
    }

    #nav-mobile span{
        padding:2px 3px;
        border-radius:5px;
        font-size:40px;
        color:#AF0C14;
    }

    
.index {
    padding: 50px 0px;
    width: auto;
    padding-left: 0px;
}
.btn-red {
    margin-bottom: 50px;  margin-top: 0px;
}
.urbanizacion img {
    width: 100%;
    float: left;
    margin: 0px -45px -3px 0px;
}
.index h1 {
    font-size: 35px;
    padding: 0px 20px;
    font-weight: 800;
}

.conocenos h2 {
    font-size: 65px;
    padding: 40px 0px;
    width: 100%;
}
    /* Fijamos nuestro nav en 100% ancho y dejamos de flotarlo  */
    #menu{
        width: 100%;
        float: none;
        padding-top: 0px;

    }
        /* Convertimos nuestra lista de enlaces en un menú horizontal */
        #menu ul{
            width:100%;
            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.5);
            -moz-box-shadow: 0 1px 2px rgba(0,0,0,.5);
            box-shadow: 0 1px 2px rgba(0,0,0,.5);
            max-height: 0;
            overflow: hidden;
        }
            /* estilos para los LI del menu */
            #menu li{
                background: #C40505;
                float: none;
            }

            /* Quitamos el borde del ultimo item del menú */
            #menu li:last-child{ border-bottom: 0;}
                #menu li a{
                    padding: 20px 0;
                    height: auto;
                    line-height: normal;
                    color:#fff;
                }
                #menu li a:hover{
                    background:#232323;
                    color:#fff;
                }

        /* Agregamos una animación al despligue del menú */
        #menu ul.open-menu{
            max-height: 400px;
            margin-top:-5px;
            -webkit-transition: max-height .4s;
            -moz-transition: max-height .4s;
            -ms-transition: max-height .4s;
            -o-transition: max-height .4s;
            transition: max-height .4s;
        }

        

}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}