.imp{
    padding-top: 74px;
}

.imp_hero{
    background-image: url('../import/tyler-casey-CkZF0-etxU8-unsplash.jpg');
    height: 50vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}


.imp_hero h1{
    position: absolute;
    left: 52%;
    top: 35vh;
    transform: translate(-50%, -50%);
    font-size: 47pt;
    font-weight: 800;
    color: rgb(253, 243, 243);
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

/* Import Services */
.import_services{
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}


.is{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    padding: 20px;
    margin: 10px;
    place-items: center;
    /* overflow-x: auto; */
    justify-content: space-around;
}

.prod{
    display: flex;
    justify-content: center;
    align-items: center;
}

.prod_group{
    border: 1px dotted yellowgreen;
    margin: 30px;
    padding: 10px;
}

.prod_mes{
    margin-top: 10px;
    padding: 0px 40px;
}


.ser{
    margin: 20px;
    justify-content: space-evenly;
    padding: 10px;
    
}





.prod_group:hover{
    background-color: rgba(128, 128, 128, 0.048);
}

.ser img{
    width: 250px;
    height: 250px;

}

hr{
    color: yellowgreen;
    display: none;
}




/* responsiveness */
@media screen and (max-width:1358px){
    .imp_hero h1{
        font-size: 40pt;
        color: rgb(241, 236, 227);
    }
    .is{
        grid-template-columns: repeat(1, 1fr);
        overflow-x: none;
    }
}



@media screen and (max-width:958px){
    .imp_hero h1{
        font-size: 40pt;
    }
    .is{
        grid-template-columns: repeat(1, 1fr);
        overflow-x: none;
    }
}


@media screen and (max-width:798px){
    .imp_hero h1{
        font-size: 30pt;
    }

    .is{
        grid-template-columns: repeat(1, 1fr);
        overflow-x: none;
    }
}

@media screen and (max-width:500px){
    .import_services{
        max-width: 100%;
    }

    .imp_hero h1{
        font-size: 30pt;
        transform: translate(-47%, -30%);
    }

    .prod{
        display: block;
    }

    .prod_group{
        border: none;
        border-top: 1px dotted yellowgreen;
        border-bottom: 1px solid yellowgreen;
        margin: 0px;
        padding: 0px;
    }

    hr{
        
        display: block;
    }

    .is{
        grid-template-columns: repeat(1, 1fr);
    }

    .ser img{
        width: 120px;
        height: 120px;
    }

    .is{
        padding: 0px;
        overflow-x: none;
    }

    .prod_mes{
        padding: 5px;
        margin: 0px 5px;
        font-size: 12pt;
    }

    .prod{
        display: flex;
    }
}