.tecno-body {
    padding-top: 10px;
    padding-left: 10%;
    padding-right: 10%;
    padding-bottom: 10px;
    background-color: #0a0b3f;
    text-align: center;
    display: grid;
    gap: 13px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr))
}

.tecno-body div {
    background-color: #0a0b3f;
    border: solid #fff;
    height: 120px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 1px 10px rgba(255, 255, 255, .8);
    transition: all .4s ease
}

.tecno-body img {
    width: 120px;
    height: 120px
}

#tecno h1 {
    font-size: 45px;
    padding-bottom: 20px;
    text-align: center;
    padding-top: 20px;
    color: #fff;
    background-color: #090b3b;
    text-transform: uppercase
}

.tecno-body .html:hover {
    transition: 0.3s linear;
    border: solid #f16529;
    box-shadow: 5px 5px 20px #f16529;

    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .css img {
    height: 100px;
    width: 100px;
}

.tecno-body .css:hover {
    transition: 0.3s linear;
    border: solid #1572b6;
    box-shadow: 5px 5px 20px #1572b6;

    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .js img {
    height: 100px;
    width: 86px;
}

.tecno-body .js:hover {
    transition: 0.3s linear;
    border: solid #e4bd00;
    box-shadow: 5px 5px 20px #e4bd00;

    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .sass img {
    height: 120px;
    width: 120px;
}

.tecno-body .sass:hover {
    transition: 0.3s linear;
    border: solid #cd6799;
    box-shadow: 5px 5px 20px #cd6799;

    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .react img {
    height: 100px;
    width: 180px;
}

.tecno-body .react:hover {
    transition: 0.3s linear;
    border: solid #04d7f7;
    box-shadow: 5px 5px 20px #04d7f7;
     
    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .bootstrap img {
    height: 170px;
    width: 170px;
}

.tecno-body .bootstrap:hover {
    transition: 0.3s linear;
    border: solid #7952b3;
    box-shadow: 5px 5px 20px #7952b3;
     
    transition: transform .2s ease;
    transform: translate(0, -5px);
}

.tecno-body .git img {
    height: 100px;
    width: 100px;
}

.tecno-body .git:hover {
    border: solid #ee5132;
    box-shadow: 5px 5px 20px #ee5132; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .npm img {
    height: 100px;
    width: 100px;
}

.tecno-body .npm:hover {
    border: solid #eb3534;
    box-shadow: 5px 5px 20px #eb3534; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .visualstudio img {
    height: 100px;
    width: 100px;
}

.tecno-body .visualstudio:hover {
    border: solid #0093da;
    box-shadow: 5px 5px 20px #0093da; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .react-router img {
    height: 100px;
    width: 100px;
}

.tecno-body .react-router:hover {
    border: solid #f54553;
    box-shadow: 5px 5px 20px #f54553; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .react-hook-form img {
    height: 100px;
    width: 145px;
}

.tecno-body .react-hook-form:hover {
    border: solid #ec5990;
    box-shadow: 5px 5px 20px #ec5990; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .angular img {
    height: 100px;
    width: 105px;
}

.tecno-body .angular:hover{
    border: solid #ff0000;
    box-shadow: 5px 5px 20px #ff0000; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .typescript img {
    height: 100px;
    width: 105px;
}

.tecno-body .typescript:hover{
    border: solid #1572b6;
    box-shadow: 5px 5px 20px #1572b6; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}

.tecno-body .figma img {
    height: 100px;
    width: 100px;
}

.tecno-body .figma:hover {
    border: solid #ee5132;
    box-shadow: 5px 5px 20px #ee5132; 
    
    transition: transform 0.5s ease;
    transform: translate(0, -5px);
}