*{
	list-style:none;
	text-decoration: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box; 
	box-sizing: border-box;

}

body{
	background: darkgray;
}
/*----------------------BARRA DE MENU-------------------------------*/
header {
	position: fixed;
	width: 100%;
	height: 70px;
	background: black;
	/*padding-top: 10px;*/
	display: inline-block;
	
	z-index:10
}


ul{
	margin-left:20px;
	
	top:-10px;
	/*border: solid white;*/
	

}

.nav{
	width:200px;
	height:40px;
	display: inline-block;
	
	/*border: solid black;
	background: black;
	position: relative;*/
	margin: 10px;
	margin-top:0;
	padding: 0;
	/*border: solid red;*/
	position:relative;
	top:-10px;
	
}


#Ev {
	
	width: 193.7px;
    height: 39.78px;
	margin-right:none;
	float: left;
	margin-left: 20px;
	margin-right:60px;
	margin-top:0;
	background: url("EvolutechMx.png");
	background-size:contain; 	
	background-repeat: no-repeat;
	

	
}

#Ev:hover {
	
	width: 196.35px;
    height: 42.165px;

	float: left;	
	margin-right:57.35px;
	margin-top: 0;
	background: url("EvolutechMx_hover.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	

	
}



#desplegable ul{
	display: none;
	z-index: 90;
	
}

#desplegable:hover ul{
	display: block;
	z-index: 90;
	width:155px;
	height:166;
	position: relative;
	top:8px;
	left:-150px;
}



.menu{
	font-family: 'Open Sans', sans-serif;
	color: white;
	font-style: oblique; 
	font-weight: 500;
	text-align:center;
	position: relative;
	top:20px;
	
}

.menu:link{
	color: white;

}

.menu:visited{
	color: white;
}

.menu:hover{
	
	text-shadow: 0px 0px 10px #fff;
	font-family: 'Open Sans', sans-serif;
	color: white;
	font-style: oblique; 
	font-weight: 700;
	text-align:center;	
}

.nav1{
	width:150px;
	height:50px;
	background: black;
	margin: 0;
	margin-top:0;
	padding: 0;
	border:solid black;
	position:relative;
	top:30px;
	left:-30px;
	
}

  #who{
	  display: none;
  }
    #servs{
	  display: none;
  }
    #web{
	  display: none;
  }
    #cont{
	  display: none;
  }
  
   #desplegable{
	
	width:20px;
	height:20px;
	background: url("menu_desplegable.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	/*border: solid green;*/
	display:inline-block;
	position: relative;
	margin-left: none;

}

#desplegable:hover{
	
	width:18px;
	height:15px;
	background: url("menu_desplegable_hover.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	display:inline-block;
	position: relative;
			
}


/*--------------------------CUERPO DE LA PAGINA---------------------*/

section{
	width: 100%
}
#top{
	
	background: black;
	width: 100%;
	height: 70px;
	
}

#inicio{
    width: 100%;
	height: 510px;
    
	
	background: -webkit-radial-gradient(
        center,
        white 0%,
		gray 80%
        );
		
	background: -moz-radial-gradient(
        white 0%,
		gray 80%
        );
 
}


#conocenos{
     
	height: 500px;
    width: 100%;
    background: url("conocenos1.png");
	background-repeat: no-repeat;
    background-position:top center;
	
	padding-bottom:0;

}

#knowus{
	width:48%;
	height: auto;
	position: relative;
	margin:auto;
	margin-left:2%;
	margin-top:20%;
	left:30%
}

#textwhose{
	display:block;
	width:45%;
	height:auto;
	position: relative;
	left:30%;
	margin-left:2%
}
p.whose{
	font-family: 'Open Sans', sans-serif;
	font-size:3vw;
	color: white;
	position:relative;
	/*left: 10%;*/
	text-align: justify;
	float: left;
	margin-bottom: 9px;
	text-shadow: 2px 2px 0px #000;
}

/*-----------------------------Servicios----------------------------*/

#servicios{
    height: 480px;
    width: 100%;
    background: url("servicios.jpg");
	background-repeat: no-repeat;
    background-position:center center;
	position:relative;	
	padding-top:30px;
}

#textservs{
	width: 80%;
	height: auto;
	position: relative;
	margin:auto;
	
	
}

p.servs{
	font-family: 'Open Sans', sans-serif;
	font-size:3vw;
	color: white;
	position:relative;
	/*left: 10%;*/
	text-align: justify;
	float: left;
	margin-bottom: 9px;
	text-shadow: 2px 2px 0px #000;
}

/*-----------------------------------Nuestra Red---------------------*/
 #red{
    height: 530px;
    width: 100%;
    background:  url("fondotras.png"), url("red.jpg");
	background-repeat: no-repeat;
    background-position:center top;
	position:relative;
	padding-top:30px;
	
}

h2{
	
	font-size:5vw;
	font-family:  'Montserrat', sans-serif;
	color: white;
	float:center;
	margin-left: 30px;
	/*font-style: oblique;*/
	text-shadow: 2px 2px 0px #000;
	float: left;
	
}

#textred{
	width: 90%;
	height: auto;
	position: relative;
	margin:auto;
	
	
	
}

p.red{
	font-family: 'Open Sans', sans-serif;
	font-size:3vw;
	color: white;
	position:relative;
	
	text-align: justify;
	float: left;
	margin-bottom: 9px;
	text-shadow: 2px 2px 0px #000;
}

p.red span{
	font-family: 'Open Sans', sans-serif;
	font-size:4vw;
	color: white;
	/*font-style: oblique;*/
	
}

.ired{
	
	width:30%;
	height: auto;
	display:inline-block;
}

article#promo{
    height: 600px;
    width: 100%;
    background: url("promo.jpg");
	background-repeat: no-repeat;
    background-position:center center;
	position:relative;	
}

/*-----------------------------Contactanos----------------------------*/

#contacto{
    height: 600px;
    width: 100%;
    background: url("contactanos.jpg");
	background-repeat: no-repeat;
    background-position: 30% 85%;
	position:relative;	
	padding-top: 10px;
}

.contenedor form .form-header .form-title{
	
	font-size:30px;
	font-family:  'Montserrat', sans-serif;
	color: white;
	padding: 14px 0;

}

.contenedor form{
	
	background: rgba(0,0,0,.6);
	width: 80%;
	max-width:650px;
	
	margin: auto;
	padding: 5px 35px;
	margin-top: 30px;
	padding-bottom:30px;
	border-radius: 3px;

}



.contenedor form .form-label{
	
	display: block;
	color: white;
	font-size: 16px;
	font-family:  'Open Sans', sans-serif;
	position: relative;
	
}

.contenedor form .form-input, .form-textarea{
	
	background: rgba(0,0,0,.7);
	border: none;
	outline: none;
	border-bottom: 2px solid white;
	width: 95%;
	padding: 12px;
	margin-bottom: 20px;
	border-radius: 2px;
	font-size: 14px;
	color: white;
	font-family: 'Open Sans', sans-serif;	
}

.contenedor form .form-input, .form-textarea{
	
	resize: vertical;
	max-height:150px;
	min-height:50px;
	
}

.contenedor form .btn-submit{
	
	width: 100%;
	font-family: 'Open Sans', sans-serif;	
	outline: none;
	background: white;
	font-size: 16px;
	border: none;
	color: #000;
	padding: 15px 0;
	cursor: pointer;
}


footer{
	background: darkgray;
	width: 100%;
	height: 10%;
	padding-top:5px;
	text-align:center;
    
}

#face{
	width:5%;
	height:auto;
	margin:0;
	margin-left:5%
}

#foot{
	display:block;
}
p{
	font-family: 'Montserrat', sans-serif;
}



/*----------------------Media Queries----------------*/
@media screen and (min-width: 600px){
	    #who{
	  display: inline-block;
  }
   
    #desplegable{
	
	width:24.4px;
	height:24.4px;
	background: url("menu_desplegable.png");   
	background-size:cover; 
	background-repeat: no-repeat;
	/*border: solid green;*/
	display:inline-block;
	position: relative;
	margin-left:0;
	float: right;
}

#desplegable:hover{
	
	width:23.4px;
	height:24.4px;
	background: url("menu_desplegable_hover.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	display:inline-block;
	position: relative;
	margin-left:0;
	float: right;
			
}


    #who1{
	  display: none;
  }
  
  h2{
	  font-size:30px;
  }
  
  p.red{
	  font-size:14px;
  }
  	
  p.red span{
	  font-size:20px;
  }
  
  #knowus{
	  margin-top:5%;
  	
}



@media screen and (min-width: 800px){
	    #who{
	  display: inline-block
  }
    #servs{
	  display: inline-block;
  }
 
  #desplegable{
	
	width:24.4px;
	height:24.4px;
	background: url("menu_desplegable.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	/*border: solid green;*/
	display:inline-block;
	position: relative;

}

#desplegable:hover{
	
	width:23.4px;
	height:23.9px;
	background: url("menu_desplegable_hover.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	display:inline-block;
	position: relative;
			
}

    #who1{
	  display: none;
  }
  
    #servs1{
	  display: none;
  }
  
  #textservs{
	  
	  top:0;
	  
  }
  
  p.servs{
	
	font-size:25px
}

p.whose{
	font-size:2.3vw;
}
}

@media screen and (min-width: 1010px){
	    #who{
	  display: inline-block;
  }
  
  	    #servs{
	  display: inline-block;
  }
  
  	    #web{
	  display: inline-block;
  }
  
  #desplegable{
	
	width:24.4px;
	height:24.4px;
	background: url("menu_desplegable.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	/*border: solid green;*/
	display:inline-block;
	position: relative;

}

#desplegable:hover{
	
	width:23.4px;
	height:23.9px;
	background: url("menu_desplegable_hover.png");   
	background-size:contain; 
	background-repeat: no-repeat;
	display:inline-block;
	position: relative;
			
}

    #who1{
	  display: none;
  }
  
    #servs1{
	  display: none;
  }
  
      #web1{
	  display: none;
  }
  
   h2{
	  font-size:37px;
  }
  
  p.red{
	  font-size:21px;
  }
  	
  p.red span{
	  font-size:24px;
  }
  

  
  .ired{
	position:relative;
	  left:20%;
	width:20%;
	height: auto;
	display:inline-block;
	padding-right:6%;
}
  	p.whose{
	font-size:2vw;
}

#knowus{
	left:0;
	margin-bottom:9%
}

#textwhose{
	display: inline-block;
	left:0;
	margin:0;
	margin-top:7%;
	margin-left:10%;
	
	width:35%;
}

@media screen and (min-width: 1200px){
	    #who{
	  display: inline-block;
  }
  
  	    #servs{
	  display: inline-block;
  }
  
  	    #web{
	  display: inline-block;
	  margin-right= none;
  }
  	    #cont{
	  display: inline-block;
	  margin=0
  }
  
  #desplegable{
	
display:none;
}

}