* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font: normal normal 1rem/1.5rem 'Barlow', sans-serif;
	color: #000;
	text-align: left;
	background-color: #fff;
}

.img-fluid {
	max-width: 100%;
}

.gris {
	background: #EFEFEF;  
}

.rosa {
	background: #FFECF8;  
}

.flex {
	display: flex;
	-ms-flex-pack: justify !important;
	justify-content: space-between !important;
	-ms-flex-item-align: center !important;
	align-self: center !important;
	padding: .5rem 1.1rem  1.8rem;
}

button {
	margin: .5rem;
    padding: 0.8rem;
    background: transparent;
    border: 1px solid #000;
    border-radius: 3px;
    color: #000;
    cursor:pointer;
     -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

button:hover {	
    background: #000;
    color: #fff;
}

.sobremi button {
	margin: 0;
}

.nav {
    background: #fff;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0rem 1rem 0 1.8rem;
    position: fixed;
    z-index: 999;
}

.nav img {
	width: 3rem;
}

.nav ul {
	display: flex;  
	align-self: center;
}

.nav li {
    list-style: none;
    padding: 0 .5rem;
}

.nav a {
	text-decoration: none;
	color: #000;
}

.nav .activo {
	border-bottom: 4px solid #FF1A1A;
	padding-bottom: 0.2rem;
}

.marca {
	font-weight: bold;
}

.portada {    	
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: repeat(12, 1fr);  
	background: #FFF;
	width: 100%;
	height: 90vh;
}

.portada h1{
	font: normal bold 3rem 'Barlow', sans-serif;
	color: #000;
	grid-row-start: 4;
	grid-column: 2/12;
	margin: 0;
}


.behance, .linkedin {
	display: none;
}

.portada h2{
	font: normal 400  1.2rem 'Barlow', sans-serif;
	letter-spacing: .05rem;
	color: rgba(0, 0, 0, 0.4);
	grid-row-start: 3;
	grid-column: 2 / 11;
	align-self: flex-end;
}

.emoji {
	font-size: 2rem;
	grid-column: 2/11;
	grid-row-start: 10;
	margin: 0;
}

.redes {
	font: normal normal 1.25rem/2.20rem 'Barlow', sans-serif;
    color: #000;
    vertical-align: top;
    text-decoration: none;
    display: block;
    padding: 0.5rem 1.5rem 0.5rem 0rem;
    white-space: nowrap;
}

.redes img{
    width: 25px;
    vertical-align: text-bottom;
}

.pie {
	background: #EFEFEF;
	width: 100%;
	height: 2.5rem;
	position: fixed;
	bottom: 0;
}

.slideUp {
  animation: slideUp .3s forwards ease-out;
}

.slideDown {
  animation: slideDown .5s forwards ease-out;
}


@keyframes slideUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(100px);
  }
}

@keyframes slideDown {
  0% {
    transform: translateY(100px);
  }
  100% {
    transform: translateY(0px);
  }
}





@media (min-width: 360px) {

	.nav li {
		list-style: none;
		padding: 0 1rem;  
	}

}


@media (min-width: 600px) {
	.redes {
		display: -webkit-inline-box;
	}
	
	.sticky {
		position: fixed;
		top: 0;
		width: calc(100% - 4.09rem);		
	}

	.nav {
		padding: 0 1rem 0 1.5rem;
		width: calc(100% - 4.09rem);
	}


	 .marca::after {
	    content: ' EMILIA TIPITTO';
	    font: normal normal  1.4rem 'Barlow', sans-serif;
	    letter-spacing: .05rem;
	    color: rgba(0, 0, 0, 0.4);
	    display: inline-block;
	    opacity: 0;
	    transition: ease .3s;
	}

	.marca:hover::after {
	    opacity: 1;
	    transition: ease .3s;
	}

	.nav li::after {
	    content: '';
	    display: block;
	    width: 0;
	    height: 4px;
	    background: #FF1A1A;
	    transition: width .3s;
	}

	.nav li:hover::after {
	    width: 100%;
	    transition: width .3s;
	}
	.gris {  
	    padding: 2rem;
	}

	.portada { 
		padding: 1.25rem;
	}

	.portada h1{    
		grid-row-start: 7;
		grid-column: 4/10;
	}

	.portada h2{  
		font: normal 400  1.4rem 'Barlow', sans-serif;  
		grid-row-start: 6;
		grid-column: 4/10;
	}

	.emoji{    
		grid-column: 1/8;
		grid-row-start: 12;
	}

	.behance, .linkedin {
		display: block;
		grid-column: 12;
		width: 2.188rem;
		margin: auto 0 0 auto;
		margin-bottom: 1rem;
		text-align: center;
	}

	.behance {
		grid-row: 11;
	}	

	.linkedin {  
		grid-row: 12; 
		margin-top: 0; 
	}

	.behance::after, .linkedin::after {
	    content: '';
	    display: block;
	    opacity: 0;
	    border-bottom: 4px solid #FF1A1A;
	    transition: all .3s;
	}

	.behance:hover::after, .linkedin:hover::after {
	   opacity: 1;
	   transition: all .3s;
	}


}

@media (min-width: 1050px) {
	.portada h1 {
		font: normal bold 5rem 'Barlow', sans-serif;
	}
}

@media (min-width: 1680px) {
	.portada h1 {
		font: normal bold 6rem 'Barlow', sans-serif;
	}
}


.portfolio {      
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: 1fr auto;  
	width: 100%;  
	padding: 2rem 0rem 1rem;
}

.portfolio img {
	max-width: 100%;
}

.portfolio a {
	color: #000;
	text-decoration: none;
	margin: 0;
}

.portfolio h3 {
    font: normal bold  1.2rem/1.8rem 'Barlow', sans-serif;
    padding: .5rem;
    margin: 0;
}

 .portfolio span {
   font-weight: normal;
}


.portfolio .p-1 {
	grid-column: 1/13;
	grid-row: 1;
 } 

.portfolio .p-2 {
	grid-column: 1/13;
	grid-row: 2;	
} 


.portfolio .p-3 {
	grid-column: 1/13;
	grid-row: 3;
 } 


.portfolio .p-4 {
	grid-column: 1/13;
	grid-row: 4;
} 

.footer {
	background: #fff;
	text-align: left;
	padding: 2.25rem 1.8rem;
	/*border: 1px solid rgba(0,0,0,.1);*/
}

.footer img {
	width: 30px;
	vertical-align: text-bottom;
}

.footer a {
	font: normal normal 1.3rem/2rem 'Barlow', sans-serif;
    color: #000;    
    padding: 1rem 0;
    text-decoration: none;
    display: block;
}


.footer h3 {
	font: normal bold 1.875rem/2rem 'Barlow', sans-serif;
	margin-top: 0;
}

@media (min-width: 767px) {
	.rosa {  
    	padding: 2rem;
  	}
  	.portfolio { 
  		background: #fff;
		padding: 4rem 2rem;
		grid-gap: 2rem;
	}
	
	.portfolio .p-1 {
		grid-column: 1/7;
		grid-row: 1;
	 } 

	.portfolio .p-2 {
		grid-column: 7/13;
		grid-row: 1;
		padding-top: 8rem;
	} 


	.portfolio .p-3 {
		grid-column: 1/7;
		grid-row: 2;
	 } 


	.portfolio .p-4 {
		grid-column: 7/13;
		grid-row: 2;
		padding-top: 8rem;
	} 

	.portfolio h3 {
	    font: normal bold  1.4rem/2rem 'Barlow', sans-serif;
	    padding: .5rem 0rem;
	    margin: 0;
	}

	.footer {
		background: #fff;
		text-align: center;
		padding: 2.25rem;
	}

	.footer img {
		width: 30px;
	}

	.footer a {
		font: normal normal 1.3rem/2rem 'Barlow', sans-serif;
	    color: #000;
	    vertical-align: top;
	    padding: 2rem;
	    text-decoration: none;
	    display: inline;
	}

	
}

.sobremi, .portfolio-interna {      
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-template-rows: 1fr auto;  
	width: 100%;  	
	background: #fff;
	padding: 1.5rem 0rem;
    grid-gap: 1rem;
}

.sobremi {
	padding: 1.5rem 2rem;
}

.s-1 {
	grid-column: 1/10;
    grid-row: 1;
    margin: 0;
}

.s-2 {
	grid-column: 1/8;
    grid-row: 2;
    margin: 0;
}

.s-2b {
	grid-column: 1/13;
    grid-row: 3;
    margin: 0;
}

.s-3 {
	grid-column: 8/13;
    grid-row: 2/3;
    max-width: 100%;
    border: 5px solid #ffecf8;
}

.s-4 {
	grid-column: 1/13;
    grid-row: 4;
}

.s-5 {
	grid-column: 1/13;
    grid-row: 5;
}

.s-6 {
	grid-column: 1/13;
    grid-row: 6; 
}

.s-7 {
    display: none;
}

.s-8 {	
	display: none;
}

.s-8.footer {
		background: #fff;
		text-align: left;
		padding: 0;
	}

.s-8.footer a{
	padding-left: 0;
}

.fotos {
	padding: 1.25rem;
}

.fotos .i-2 {
	display: block;
	max-width: 100%;
	margin: auto;
	text-align: center;
}

.fotos .i-1 {
	display:none;
	max-width: 100%;
	margin: auto;
	text-align: center;
}

.story .bg-rosa {
	grid-column: 1/13;
	grid-row: 6/11;
	background: #FFECF8; 
}


.pi-1 {
	grid-column: 1/13;
    grid-row: 2;
    margin: 0;
    padding: 0 2rem;
}

.pi-2 {
	grid-column: 1/13;
    grid-row: 1;
    margin: 0 auto;
    text-align: center;
    max-width: 100%;
    padding: 0;
}

.pi-3 {
	grid-column: 1/13;
    grid-row: 3;
    margin: 0;
    padding: 0 2rem;
}

.pi-4 {
	grid-column: 1/13;
    grid-row: 4;
    margin: 0;
    padding: 0 2rem;
}

.story .pi-4 {
	grid-row: 4;
    margin: 0 auto;
    grid-column: 1/13;
    padding: 2rem 2rem 0;
    max-width: 700px;
}

.bomba .pi-4 {
	grid-row: 4;
    margin: 0 auto;
    grid-column: 1/13;
    padding: 2rem 2rem 0;
    max-width: 700px;
    text-align: center;
}

.fip .pi-4{
	 grid-column: 1/13;
	 padding: 0;
}


.pi-2 img, .pi-5 img, .pi-6 img, .pi-7 img{
	max-width: 100%;
}

.pi-5 {	
    grid-row: 5;
    margin: 0 auto;
    text-align: center; 
    grid-column: 1/13;
    padding: 2rem;
}

.pi-5 div {
	padding-bottom: 3rem;
}

.pi-5 div:last-child {
	padding-bottom:0rem;
}

.fip .pi-5 {
	background: transparent;
	padding: 0;
	display: block;
	margin: 0;
	margin-top: -40px;
}

.pi-6 {	
	grid-row: 6;
	grid-column: 1/13;
	margin: 0; 
	padding: 0 2rem;
}


.pi-7 {
	grid-column: 1/13;
    grid-row: 7;
    margin: 0;
    padding-top: 5rem;
    padding: 0 2rem;
}

.bomba .pi-7 {
	grid-row: 7;
}

.story .pi-7 {
	padding: 2rem;
}



.pi-8 {
	grid-column: 1/13;
	grid-row:8;
	border: none;
	padding:0;
}

.story .pi-8 {
	margin: 0 auto;
    text-align: center; 
}

.bomba .pi-8 {
	text-align: center;
	grid-row:8;
}


.story .pi-8 img {
	max-width: 100%;
}


.pi-9 {	
    display: none;
    margin: auto;
}

.bomba .pi-9 {	
    display: block;
    margin: auto;
    text-align: center;
    max-width: 700px;
    padding: 0 2rem;
    grid-column: 1/13;
    grid-row: 9;
}

.story .pi-9 {
	max-width: 100%;
	grid-row: 9;
	grid-column: 1/13;
}


.pi-10 {
	grid-column: 1/13;
    grid-row: 9;
    margin: 0;
    padding: 2rem 2rem 0;
    border-top: 1px solid rgba(0,0,0,.1);
}

.pi-10 img{
	max-width: 100%;
}

.story .pi-10 {
	grid-row: 10;
	border: none;
	display: flex;
	max-width: 100%;
	padding: 0 0 2rem;
}

.bomba .pi-10 {
	border: none;
	text-align: center;
	grid-row: 10;
	padding: 0;
}

.pi-11 {	
    grid-row: 10;
    margin: 0 auto;
    text-align: center; 
    grid-column: 1/13;
}

.pi-11 img {
	max-width: 100%;
}

.pi-11 div {
	display: none;
}

.pi-11 .img-mobile {
	display: block;
	margin: auto;
}

.bomba .pi-11 {	
   grid-row: 11;
   margin: auto;
   max-width: 700px;
   padding: 0 2rem;
}

.pi-12 {	
    display: none;
    margin: auto;
}

.bomba .pi-12 {	
    grid-row: 12;
}


.pi-13 {
	grid-column: 1/13;
    grid-row: 11;
    margin: 0;
    padding: 2rem 2rem 0;
    border-top: 1px solid rgba(0,0,0,.1);
}

.story .pi-13 {
	border: none;
}

.bomba .pi-13 {
	border: none;
	text-align: center;
	grid-row: 13;
	padding: 0;
}


.pi-14 {	
    grid-row: 12;
    margin: 0 auto;
    text-align: center; 
    grid-column: 1/13;
}

.pi-14 img {
	max-width: 100%;
}

.bomba .pi-14 {
	padding: 0 2rem;
	grid-row: 14;
}

.story .pi-14 {
	grid-column: 1/13;
	border: none;
	padding:0;
	overflow-x: hidden!important;
}

.story .pi-14 div {
    width: 200%;
    margin: auto;
    text-align: center;
    margin-left: -50%;
    overflow-x: hidden!important;
}

.story .img-desktop {
	display: none;
}

.bomba .img-desktop {
	display: none;
}

.pi-15 {	
    display: none;
    margin: auto;
}

.bomba .pi-15 {
	grid-row: 15;
	display: block;
	grid-column: 1/13;
}

.pi-16 {
	grid-column: 1/13;
	padding:0;
	 grid-row: 13;
}

.fip .pi-6 {	
	padding-bottom: 1rem;
}

.fip .pi-4 {
	overflow-x: hidden;
}

.fip .pi-5 {
	overflow-x: hidden;
}


.fip .pi-4 img {
    width: 200%;
    margin: auto;
    text-align: center;
    margin-left: -50%;
    overflow-x: hidden!important;
}

.fip .pi-5 img {
	max-width: 200%;
    width: 200%;
    margin: auto;
    text-align: center;
    margin-left: -50%;
    overflow-x: hidden!important;
}
.fip .pi-7{
	grid-column: 1/13;
	grid-row: 7;
	padding: 0 2rem;
	margin: 0;
	text-align: left;
}

.fip .pi-8{
	grid-column: 1/13;
	grid-row: 8;
	padding: 0 2rem;
	margin: 0;
	text-align: left;
}

.fip .pi-9{
	grid-column: 1/13;
	grid-row: 9;
	padding: 0 2rem;
	margin: 0;
	text-align: left;
	border: none;
	display: block;
}

.fip .pi-10{
	grid-column: 1/13;
	grid-row: 10;
	border:none;
	text-align: center;
    margin: auto;
}

.fip .pi-10 p {
	padding: 0;
	padding-bottom: 2rem;
	margin: .1rem;
}

.fip .pi-11 {
	display: none;
}

.fip .pi-12{
	grid-column: 1/13;
    grid-row: 12;
    padding: 2rem 2rem;
    margin: 0;
    text-align: left;
    border: none;
    display: block;
}

.fip .pi-13{
	grid-column: 1/13;
	grid-row: 13;
	padding: 0rem 2rem;
	margin: 0;
	text-align: left;
	border:none;
}





.fip .pi-14 {
	grid-row: 14;
	display: block;
}

.fip .iconos {
	display: flex;
	-webkit-box-pack: justify !important;
  	-webkit-justify-content: space-between !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.fip .iconos img{
	width: 60px;
}

.fip .type p{
	font: normal normal 1rem/1.8rem 'Lato', sans-serif;
}

.fip .type h2{
	font: normal normal 1.45rem/2rem 'Lato', sans-serif;
}

.fip .type .black {
	font-weight: 900;
}

.fip .type .bold {
	font-weight: 700;
}

.fip .type .regular {
	font-weight: 400;
}

.color {	
	width: 235px;
	height: 86px;
	border-radius: 40px;
	padding: 0;
	margin: 0;
}

.azul-1 {
	background: #00F3FF;
}

.azul-2 {
	background: #3B6DF5;
}

.azul-3 {
	background: #2E3DC8;
}

.azul-4 {
	background: #051397;
}

.rosa-2 {
	background: #E34654;
}


.scroll {
	-webkit-overflow-scrolling: touch;
	padding: 2rem 0;
}

.scroll a, .scroll p {
	text-align: center;
	margin: 0;
	color: #000;
	text-decoration: none;
	padding-bottom: 1rem;
}


.scroll .img-scroll {
	width: 70%;
}

.scroll > .contenedor-scroll {
	overflow-x: auto;
	white-space: nowrap;
	flex-wrap: nowrap;
}
.scroll > .contenedor-scroll > .img-scroll {
	display: inline-block;
}

.portfolio-interna .subtitulo-2 {
	margin-bottom: .4rem;
}

.portfolio-interna .titulo {
	margin-top: 0;
	padding-bottom: 1rem;
}


.titulo {
	font: normal bold 2.5rem 'Barlow', sans-serif;
	color: #000;
	margin-bottom: .4rem;
}

.subtitulo {
	font: normal bold 1.65rem 'Barlow', sans-serif;
	color: #000;
	margin: 1.8rem 0 .4rem;
}

.texto { 
	font: normal normal 1.125rem/1.875rem 'Barlow', sans-serif;
	color: #000;
	margin: 0;
}

.small_texto {
	font: normal normal 1.1rem/1rem 'Barlow', sans-serif;
	color: #000;
}

.subtitulo-2 {
	font: normal bolder 1rem/1rem 'Barlow', sans-serif;
	color: rgba(0,0,0,.4);
}

.lista {
	margin: 0;
    list-style: none;
    padding:0;
}

.lista li {
	padding-bottom: 1.5rem;
}

hr {
	width: 100%;
    height: 1px;
    background: rgba(0, 0, 0, 0.1);
    border: none;
}




@media (min-width: 600px) {
	.sobremi, .portfolio-interna {      		
		padding: 5rem 0rem;
		grid-gap: 2rem;
	}

	.sobremi {      		
		padding: 5rem 2rem;
	}
}

@media (min-width: 767px) {
	.sobremi, .portfolio-interna {      		
		padding: 3rem 0rem;
		grid-gap: 2rem;
	}


	.sobremi  {      		
		padding: 3rem 2rem;
		grid-gap: 2rem;
	}

	.s-1 {
		grid-column: 1/8;
	    grid-row: 2;
	}

	.s-2 {
		grid-column: 1/12;
	    grid-row: 3;
	}

	.s-2b {
		grid-column: 1/12;
	    grid-row: 4;
	}

	.s-3 {
		grid-column: 12;
	    grid-row: 3/6;
	    max-width: 15rem;
	     border: 10px solid #ffecf8;
	}

	.s-4 {
		grid-column: 1/13;
		grid-row: 5;
	}

	.s-5 {
		grid-column: 1/7;
	    grid-row: 6;    
	}	

	.s-6 {
		grid-column: 9/13;
	    grid-row: 6;    
	}

	.s-7 {
		grid-column: 1/13;
		grid-row: 7;
		display: block;
	}

	.s-8 {
		grid-column: 1/13;
		grid-row: 8;
		display: block;
	}

	.fotos {
		padding:2rem;
	}

	.fotos .i-2 {
		display: none;
	}

	.fotos .i-1 {
		display:block;
	}

	.s-9 {
		display: none;
	}

	.pi-1 {
		grid-column: 1/8;
    	grid-row: 2;  
	}

	.pi-2 {
		grid-column: 8/12;
    	grid-row: 2/3;
    	max-width: 16rem;
    	padding: 0;
	}

	.pi-3 {		
	    grid-column: 1/12;
    	margin: 2rem;
	}

	.story .pi-4 {
		text-align: center;
	}

	.bomba .pi-4 {
		text-align: center;
	}

	.pi-5 {
    	display: flex;
	}

	.pi-5 div {
		padding: 1rem 3rem 1rem 0;
	}


	.pi-5 div:last-child {
		padding-right: 0;
	}
	

	.pi-7 {		
	    padding: 0;
	    text-align: center;
	    max-width: 700px;
	    margin: auto;
	    grid-row: 9;
	}	

	.bomba .pi-7 {	
	    max-width: 100%;
	}	
	
	.story .pi-8 {		
	    padding: 0;
	    display: flex;
	}

	.story .pi-8 div {
    	padding: 0;
	}

	.story .pi-8 img {
		max-width: 100%;
	}

	.bomba .pi-8 {
		display: flex;
    	padding: 0;
	}

	.pi-9 {
		display: block;
		grid-column: 1/13;    	
	    grid-row: 9;
	    padding: 2rem;	    
	}

	.story .pi-9 {
		display: block;
	}


	.pi-10 {		
	    grid-row: 10;	   
	    text-align: center;
	    max-width: 700px;
	    margin: auto;
	}	

	.bomba .pi-10 {
		display: flex;
    	padding: 0;
    	max-width: 100%;
	}


	.pi-11 {
		grid-row: 11;
    	display: flex;
    	padding: 0;
 	}

	.pi-11 div {
		padding: 0;
		display: block;
	}

	.pi-11 .img-mobile {
		display: none;
	}

	.bomba .pi-11 {
    	display: block;
 	}


 	.pi-12 {
 		display: block;
 		grid-column: 1/13;
    	grid-row: 12;
    	max-width: 100%;
    	padding: 0 2rem;
 	}


 	.bomba .pi-12 {
		display: flex;
    	padding: 0;
    	max-width: 100%;
    	border: none;
	}
	
	.pi-13 {
		text-align: center;
	    max-width: 700px;
	    margin: auto;     	
	    grid-row: 13;
	}

	.bomba .pi-13 {
		display: flex;
    	padding: 0;
    	max-width: 100%;
	}

	.story .pi-13 {
		grid-row: 12;
	}

	.pi-14 {		
	    grid-row: 14;
	    padding: 0;
	    display: flex;
	}

	.pi-14 div {
    	padding: 0;
	}

	.story .pi-14 {
		display: block;
		grid-row: 13;
	}

	.bomba .pi-14 {		
    	display: block;
    	max-width: 700px;
 	}

	.story .pi-14 div {
	    width: 100%;
	    margin: auto;
	    text-align: center;	   
	}	
	
	.story .img-desktop {
		display: block;
	}

	.bomba .img-desktop {
		display: block;
	}
   
	.pi-15 {
		display: block;
		grid-column: 1/13;
		grid-row: 15;
		max-width: 100%;
		padding: 0 2rem;
	}

	.bomba .pi-15 {
		display: flex;
    	padding: 0;
    	max-width: 100%;
	}

	.story .pi-16 {	
		display: flex;	
		padding: 0;
		grid-row:14;		
	}

	.pi-16 div {
    	padding: 0;
	}

	.fip .pi-4 img {
		max-width: 100%;
	    width: 100%;
	    margin: auto;
	    text-align: center;
	}

	.fip .pi-5 img {
		max-width: 100%;
	    width: 100%;
	    margin: auto;
	    text-align: center;
	}
	   
	.fip .pi-6 {	
		padding-bottom: 4rem;
	}

	.fip .pi-7{
		grid-column: 1/7;
		grid-row: 7;
	}

	.fip .pi-8{
		grid-column: 1/7;
		grid-row: 8;
	}

	.fip .pi-9{
		grid-column: 1/7;
		grid-row: 9;
	}

	.fip .pi-10{
		grid-column: 7/13;
		grid-row: 7/10;
	}
	.fip .pi-11 {	
		grid-column: 1/13;
	    grid-row: 11;
	    margin: 0 2rem;
	}

	.fip .iconos img{
		width: 80px;
	}





	.scroll {
		padding: 0;
	}

	.scroll .img-scroll {
	    width: 35%;
	}

	.portfolio-in .portfolio .p-2 {
		padding-top: 0rem;
	}

	.portfolio-in .portfolio .p-4 {
		padding-top: 0rem;
	}

}


@media (min-width: 1050px) {

	.sobremi, .portfolio-interna {      	
		padding: 6rem 0rem;
		grid-gap: 2rem;
	}

	.sobremi {      	
		padding: 6rem 2rem 3rem;
		grid-gap: 2rem;
	}

	.sobremi .texto {
		max-width: 600px;
	}

	.s-1{
		grid-column: 3/8;
	    grid-row: 2;
	}

	.s-2 {
		grid-column: 3/10;
	    grid-row: 3;
	}

	.s-2b {
		grid-column: 3/10;
	    grid-row: 4;
	}

	.s-3 {
		grid-column: 10;
	    grid-row: 2/5;
	    max-width: 19rem;
	}

	.s-4 {
		grid-column: 3/11;
		grid-row: 5;
	}

	.s-5 {
		grid-column: 3/7;
	    grid-row: 6;	    
	}
	

	.s-6 {
		grid-column: 8/11;
	    grid-row: 6;    
	}

	.s-7 {
		grid-column: 3/11;
		grid-row: 7;
	}

	.s-8 {
		grid-column: 3/11;
		grid-row: 8;
	}

	.pi-1 {
		grid-column: 2/8;
    	grid-row: 1;    	
	    padding:0;
	}

	.pi-2 {
    	grid-row: 1/2;
    	max-width: 24rem;
	}

	.pi-3 {
		grid-column: 2/12;
    	grid-row: 3;
    	margin: 0;
	}

	.pi-4 {
		grid-column: 2/9;
    	padding: 0;
	}

	.pi-5 {	
    	background: #EFEFEF;
    	margin: 2rem;
	}

	.pi-5 div {
		padding: 1rem 6rem 1rem 0;
	}	

	.story .pi-5 {
		background: none;
		grid-column: 2/11;
		margin: 0 2rem;
	}
	
	.pi-6 {
		display: none;
	}

	.fip .pi-6 {
		display: block;
		text-align: left;
		max-width: 700px;
		grid-column: 2/13;
	}

	.pi-7 {
	    grid-row: 6;	    
	}

	.pi-8 {
		grid-row:7;
		border: none;
		padding:0;
	}

	.pi-9 {		
		grid-row:8;
		border-bottom: 1px solid rgba(0,0,0,.1);
		padding-top: 0;
	}	

	.bomba .pi-9 {
		border: none;
	}

	.story .pi-9 {
		border: none;
	}

	.pi-10 {		
	    grid-row: 9;
	    border: none;	    
	}

	.bomba .pi-10 {
		border: none;
	}
	
	.pi-11 {		
		grid-row:10;
	}

	
	.pi-12 {
		grid-row:11;
		border-bottom: 1px solid rgba(0,0,0,.1);
	}

	.pi-13 {		
		grid-row:12;
		border: none;
	}

	.pi-14 {
		grid-row:13;
	}

	.pi-15 {
		grid-row:14;
	}

	.pi-16 {		
		grid-row:15;	
		border: none;
		padding:0;	
	}	


	.fip .pi-7{
		grid-column: 2/8;
	}

	.fip .pi-8{
		grid-column: 2/8;
	}

	.fip .pi-9{
		grid-column: 2/8;
	}

	.fip .pi-10{
		grid-column: 8/13;
	}

	.fip .pi-11 {
		grid-column: 2/11;
	}

	.fip .pi-12{
		grid-column: 2/8;
		padding: 4rem 2rem;	
	}

	.fip .pi-13{
		grid-column: 2/13;	
	}

	.fip .iconos img{
		width: 95px;
	}
	

	.scroll .img-scroll {
	    width: 22%;
	}

	
	.titulo {
		font: normal bold 3.125rem 'Barlow', sans-serif;
	}

	.texto {
		font: normal normal 1.25rem/2.20rem 'Barlow', sans-serif;
		color: #000;
	}

		
}

@media (min-width: 1520px) {
		
	.pi-1 {
		grid-column: 3/8;    	
	}

	.pi-2 {
		grid-column: 8/12;    	
	}

	.pi-3 {
		grid-column: 3/11;
	}

	.pi-4 {
		grid-column: 3/8;
	}	
	
	.pi-6 {
		grid-column: 3/11;
	}

	
	.fip .pi-6 {		
		grid-column: 3/13;
	}

	.fip .pi-7{
		grid-column: 3/8;
	}

	.fip .pi-8{
		grid-column: 3/8;
	}

	.fip .pi-9{
		grid-column: 3/8;
	}

	.fip .pi-10{
		grid-column: 8/13;
	}

	.fip .pi-11 {
		grid-column: 3/11;
	}

	.fip .pi-12{
		grid-column: 3/8;
		padding: 4rem 2rem;	
	}

	.fip .pi-13{
		grid-column: 3/13;	
	}

	

}

.pt-5 {
	padding-top: 5rem!important;
}