
.alg{
    vertical-align: middle;
}

.left{
    width: 40%;
    display: inline-block;
    height: 43vh;
    padding: 5vw;
    margin: auto;
    position: relative;
}

.type{
    font-family: sans-serif;
    font-size: 15px;
    text-align: center;
    inline-size: fit-content;
}

.logo_dev{
    width: 40%;
    display: inline-block;
    padding: 4%;
    inline-size: auto;
}

.logo_dev > img{ 
    max-width: 600px;
}

.logo_sailor{
    display: block; 
    text-align: center;
}
span{
    color: #eb5d0b;
    font-weight: 900;
}
@media only screen and (max-width : 1460px){
    .left{
        width: 40%;

    }
    .logo_dev{
        width: 30%;
        padding: 0px;
    }
}

@media only screen and (max-width : 1215px)  {
    .left{
        width: 100%;
        height: unset;
        top: unset;
        padding: 0px;
    }

    .type{
        font-size: 27px;
    }
    .logo_dev{
        width: 100%;
        text-align: center;
        font-size: fit-content;
        padding: 0px;
    }
}

@media only screen and (max-width : 650px) {
    .left{
        width: 100%;
        height: unset;
        top: unset;
        padding: 0px;
    }
    .logo_dev > img{ 
        max-width: 375px;
    }
}
@media only screen and (max-width : 500){
    .logo_dev > img{ 
        max-width: 300px;
    }
    .logo_sailor > img{
        max-width: 300px;
    }
}

@media only screen and (max-width : 400px) {
    .logo_dev > img{ 
        max-width: 200px;
    }
    .logo_sailor > img{
        max-width: 200px;
    }
}