.title-event img {
    max-width: calc(100% - (100% / 2));
}

@media (max-width: 479px) {
    .row-login {
        height: auto;
        align-items: end;
        position: absolute;
        bottom: 0;
    }
    
    .title-event {
        top: 15%;
    }
    
    .title-event img {
        max-width: 100%;
    }
    
    .row-login > div:nth-child(2) {
        width: 100%;
    }
    
    
    .row-login > div:nth-child(3),
    .row-login > div:nth-child(4){
        width: 50%;
    }
}

@media (max-width: 479px) and (max-height: 560px) {
    .title-event {
        top: 0;
    }
}

@media (orientation: portrait) and (max-width: 479px) {
    .row-login > div:nth-child(1) {
        display: none;
    }
    
    .row-login > div:nth-child(3) {
        display: block !important;
    }
}

@media (orientation: landscape) and (max-width: 991px) and (max-height: 380px) {
    .title-event {
        display: none;
    }
}

@media (orientation: landscape) and (max-height: 300px) {
    .con-lan,
    .tui-mu {
        display: none;
    }
    
    .row-login > div {
        height: auto;
    }
    
    #login-form {
        position: unset;
        top: 50%;
        left: 50%;
        transform: unset;
        width: 100%;
    }
    
    .row-login > div:nth-child(1) {
        display: block !important;
        width: 30%;
    }
    
    .row-login > div:nth-child(1) .con-lan1 {
        position: relative;
    }
    
    .row-login > div:nth-child(2) {
        width: 40%;
    }
    
    .row-login > div:nth-child(3) {
        display: none;
    }
    
    .row-login > div:nth-child(4) {
          width: 30%;
    }
    
    .row-login > div:nth-child(4) .tui-mu {
        display: block;
        position: relative;
    }
}