Semantic UI not organizing grids - html

Question

I'm working on a project based on Semantic UI and using it's grid system. The fist part of code using grids works fine:
<div className='ui grid fluid container'>
<div className='stackable six wide column' id='logo'>
<img src='/images/home/icone-logo.svg' />
</div>
<div className='twelve wide mobile nine wide tablet nine wide computer column' id='nome'>
<img src='/images/home/nome-logo.svg' />
<br />
<br />
<span id='slogan'>Um sistema de estudo feito para você</span>
</div>
</div>
On the second part, the element loads the ui and grid styles but not the column style that should organize it.
<div className='ui grid fluid container'>
<div className='four wide cloumn'>
<img src="/images/home/ALUNO.svg" />
</div>
<div className="four wide cloumn">
<img src="/images/home/prof.svg" />
<div className="solucao-content">
<p>Lorem ipsom</p>
</div>
</div>
<div className="four wide column">
<img src="/images/home/pais.svg" />
<div className="solucao-content">
<p>Lorem ipsom</p>
</div>
</div>
<div className="four wide column">
<img src="/images/home/escola.svg" />
<div className="solucao-content">
<p>Lorem ipsom</p>
</div>
</div>
</div>
The first part is just under the body tag, the second one is under an other div.
Even when I tried loading the same first code on the place of the second one, it doesn't render properly.