@import url(http://fonts.googleapis.com/css?family=AcuminPro+Thin:100);
@import url(http://fonts.googleapis.com/css?family=PT:100,200,300,400,500);
@import url(https://fonts.googleapis.com/css?family=Fira+Sans:400,300,300italic,400italic,500,500italic,700,700italic);
@import 'https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,600,700,800|Oswald:300,400,700';




.portfolio { 
  display: grid; 
  grid-template-columns: 1fr 1fr 1fr 1fr; 
  grid-template-rows: 1fr 1fr 1fr; 
 grid-column-gap: 70px;
grid-row-gap: 70px;
  width: 79%; 
  height: 79%;
 margin: 119px auto;
animation: fade-in 1.2s linear 0s 1 normal none;
	}

@keyframes fade-in {	
0% {
opacity:0;
}
100% {
opacity:1;
}
}

@media (max-width: 1600px){
.portfolio { 
 display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 70px;
    grid-row-gap: 70px;
    justify-items: stretch;
    align-items: stretch;
    }
}



@media (max-width: 800px){
.portfolio { 
 display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 70px;
    grid-row-gap: 70px;
    justify-items: stretch;
    align-items: stretch;
    }
}
.grid-item-portfolio {
  background-color: rgba(255, 255, 255, 0.8);
  font-size: 30px;
  text-align: center;
padding: 27px;
box-shadow: -6px 5px 16px 0px rgba(51,93,128,0.74);
-webkit-box-shadow: -6px 5px 16px 0px rgba(51,93,128,0.74);
-moz-box-shadow: -6px 5px 16px 0px rgba(51,93,128,0.74);
}

.grid-item-portfolio:hover {
    transform: scale(1.09) rotate(0.0001deg);
    transition: transform 0.3s;
    background-color: #FFFFFF;
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.15); 
  }