.div-portada{
	width: 100%;
	padding-top: 0.5em;
}
.background-portada-servicio{
	background-image: url("../img/servicios.jpg");
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: 95%;
	background-position: 15% 12%;
	top: 40px;
	width: 400px;
	height: 200px;
}


 /* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid white;
  background-color: #cc9900;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: white;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: white;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
} 

.portafolio{
	width: 100%;
	text-align: center;
	margin-top: 2em;
}
.img-portafolio{
	width:300px;
}



@media  screen and (min-width: 768px) {
	.background-portada-servicio{
		background-size: 100%;
		background-position: 10% 10%;
		width: 100%;
		height: 400px;
	}
	.portafolio{
		width: 100%;
	}
	.img-portafolio{
		width: 700px;
		height: 400px;
		padding: 5px;
	}


}


@media  screen and (min-width: 1023px) {
	.logo{
		font-size: 2.2em;
		padding-left: 42px;
	}
	.icon-menu{
		display: none;
	}
	.menu{
		position: static;
		display: flex; 
		height: auto;
		width: auto;
	}
	.contenedor-title{
		font-size: 2.5em;
	}
	.background-portada-servicio{
		background-size: 100%;
		background-position: ;
		width: 100%;
		height: 530px;
	}
	.portafolio{
		width: 100%;
		display: flex;
	}
	
}