@import url("fonts.css");
@import url("animate.css");

body{
	font-family: "Proxima Nova";
}



/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

    /*==========  Mobile First Method  ==========*/

    /* Custom, iPhone Retina */ 
    @media only screen and (min-width : 320px) {
    	nav.navbar{
    		margin-bottom: 0px !important;
    		background: none;
    		border:none;
			z-index: 2;
			top:0px;
			position: absolute;
			width: 100%;
    	}
		.navbar-default .navbar-nav>li>a{
			background:#212121;
			color: #888;
		}
		.navbar-default .navbar-nav>li>a:hover{
			background:#000;
			color: #c1c1c1;
		}
        .title{
        	background: #893D24;
        	color: #fff;
        	padding: 20px 0px;
			text-align: center;
        }
        #asesoria{
        	background: url("../images/border-title.png") center bottom no-repeat;
        	margin: 40px;
        }
        #asesoria h2{
			max-width: 100%;
        	border:2px solid #893D24 ;
        	font-size: 22px;
        	font-weight: 600;
        	margin: 30px auto;
        	padding: 15px;
        	text-align: center;
        }
        #contacto{
        	background-size: cover;
        	background: url("../images/bg-contacto.jpg");
        	color: #fff;
        	margin: 50px -15px 0;
        	padding: 50px 0px;
        	text-align: center;
        	font-weight: 700px;
        }
	
		#contacto h3{
			border:2px solid #fff;
			padding: 15px;
			margin: 40px auto;
			max-width: 60%;
			font-size: 22px;
		}
		#contacto p{
			font-weight: 500;
			background: url("../images/bg-contacto-p.jpg") center bottom no-repeat;
			padding-bottom: 30px;
			margin-bottom: 30px;
		}
		#contacto p:last-child{
			background: none;
		}
        footer{
			background: #403B10 ;
			padding: 40px 0px 20px 0px;
			text-align: center;
		}

		footer p{
			color: #fff;
			float: right;
			margin-right: 50px;
		    top: 25px;
    		position: relative;
		}
		
		footer p a{
			color: #fff;
		}

		footer p a:hover,
		footer a:active,
		footer a:visited{
			color: #fff;
			text-decoration: underline;
		}

		#form-map{
			background: url("../images/bg-form-map.jpg");
			background-size: cover;
			padding-top: 50px;
			padding-bottom: 50px;
		}
/************   Deshabilitar scroll en mapa ***********/

		.map {
			width:100%;
			height:500px;	
			border:none;
			margin-bottom: 40px;
		}
		.map-wrap {
			position:relative; 
		}	
		.overlay {
			width:100%;
			min-height:500px; 
			position:absolute; 
			top:0;
		}

/************   Formulario ***********/
		#contactForm label{
			color:#746D1E;
		}
		#contactForm input[type=text],
        #contactForm input[type=email],
        #contactForm input[type=phone],
        #contactForm  textarea {
            background: none;
            border-radius: 0;
            border:2px solid #746D1E;
            color: #333;
            display: block;
            padding: 10px;
            width: 100%;
            margin-bottom: 25px;
        }

        #contactForm button, html input[type=button], input[type=reset], input[type=submit]{
        	background: #2E2D29;
        	color: #fff;
        	float: right;
        	text-transform: uppercase;
        	border-radius: 0;
        }

    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {

    }

    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {
    	.navbar-default .navbar-nav>li>a{
			background:none;
			color: #f6f6f6;
			padding: 15px;
			text-align: center;
		}
		.navbar-default .navbar-nav>li>a:hover{
			background:url("../images/bg-contacto-p.jpg") center bottom no-repeat;
			color: #fff;
		}

    	#asesoria h2,#contacto h3{
			max-width: 40%;
        }

		footer{
			background: #403B10 url("../images/bg-footer.png") 22% bottom no-repeat;
			text-align: center;
		}
    }

    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {

    }

    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {
		#asesoria h2,#contacto h3{
			max-width: 25%;
        }
    }