Dropdown block how to implement?

Question

JavaScript

Hello, I ask you for help, since I am completely zero, but it seems like I would like to implement it.
There is a form with some service select, here is the code of this "select"

<select name="service" class="input first" onChange="Selected(this)">
            <option value="0"></option>
                                                <option value="1">УЗИ</option>
            <option value="2">Ударно-волновая терапия</option>
            <option value="3">Лазерная эпиляция</option>
                                                <option value="4">Лимфастим</option>
                                                <option value="5">Консультация невролога</option>
                                                <option value="6">Консультация хирурга</option>
                                                <option value="7">Консультация кардиолога</option>
                                                <option value="8">Холтеровское мониторирование</option>
                                                <option value="9">Электрокардиограмма</option>            
          </select>

And when you select an item with laser hair removal or ultrasound, another "select" appears corresponding to one of the items, here is the JS code and one of the "select"

function Selected(a) {
        var label = a.value;
        if (label==3) {
            document.getElementById("docs_lazer").style.display='block';
            document.getElementById("docs_uzi").style.display='none';             
        } else if (label==1) {
            document.getElementById("docs_lazer").style.display='none';
            document.getElementById("docs_uzi").style.display='block';
        }
        else {
            document.getElementById("docs_lazer").style.display='none';
            document.getElementById("docs_uzi").style.display='none';
        }        
}

<div class="field" name="docs_lazer" id="docs_lazer" style='display:none;'>
        <div class="label">
          Выберите врача

        </div>
                                <div class="finput">
          <select name="docl" class="input first">
            <option value="0"></option>
                                                <option value="1">Врач 1</option>
            <option value="2">Врач 2</option>           
          </select>
        </div>
                        </div>

Now to the crux of the issue. All this works, except for one thing, but the block with the choice of doctors appears abruptly in the form, which of course is not very pleasant, but I would like this block to appear smoothly, but not through fadeIn, but as it were moving from top to bottom. Help please, who can.

Answer 1

Animate.css - FadeIn Up, FadeIn Down etc.