.team {
    width: calc(100% - 20px);
    margin-left: 20px;
}


.team .person {
    margin-bottom: 20px;
    width: 100%;
    background: #fff;
}

.team .person .preview {
    position: relative;
    
}

.team .person .preview > div {
    width: 100%;
    padding-bottom: 150%;
    background-position: center center;
	background-size: 70%;
    background-repeat: no-repeat;
	background-color: #e4e1e1;
}

.team .person .preview > div.over {
    position: absolute;
    top: 0;
    opacity: 0;
    -webkit-transition: opacity .3s ease;
       -moz-transition: opacity .3s ease;
        -ms-transition: opacity .3s ease;
         -o-transition: opacity .3s ease;
            transition: opacity .3s ease;
}

.team .person:hover .preview > div.over {
    opacity: 1;
}

.team .person .info {
    padding: 10px;
}

.team .person .info h1 {
    font-family: "Predige Rounded Regular"; 
    font-size: calc(30px + (60 - 30)*(100vw - 300px)/(640 - 300)); 
    font-weight: bold;    
    line-height: 1.2em;
    text-transform: uppercase;
    color: #383838 !important;
    letter-spacing: .08em;
    
}

.team .person .info h4 {
	margin-top: 5px;
	margin-bottom: 20px;
	font-family: "Predige Rounded Regular"; 
	text-transform: uppercase;
	font-size: calc(18px + (26 - 18)*(100vw - 980px)/(1920 - 980));
}


.team .person .info p {
    font-family: 'Futura Round Regular';  
    font-size: calc(16px + (32 - 16)*(100vw - 300px)/(640 - 300));    
    font-weight: 500;  
    color: #383838; 
    padding: 0;
}

.team .person .info p:last-child {
    margin: 20px 0 ;
}

.team .person .info p strong {
    font-family: 'Futura Round Demi'; 
}



@media only screen and (min-width: 640px) {

    .team .person .info p {
        font-size: 16px;    
    }


    .team .person .info h1 {
        font-size: 30px;   
    }



    .team .person {
        width: calc(50% - 20px);
    }
}



@media only screen and (min-width: 767px) {
    .team .person {
        width: calc(33.333333% - 20px);
    }
}



@media only screen and (min-width: 1080px) {
    .team .person {
        width: calc(25% - 20px);
    }
}



@media only screen and (min-width: 1500px) {
    .team .person {
        width: calc(20% - 20px);
    }
}


/*@media only screen and (min-width: 1960px) {
    .team .person {
        width: calc(16.666666% - 20px);
    }
}*/