.matriz { display: flex; flex-direction: row; width: 100%; margin-top: 5vh; } .capitulo_1 { width: 4vw; height: 100vh; background-color: var(--fundo_2); position: absolute; top: 0px; left: 0; overflow: hidden; transition: 1s ease; } div.ativo { background-color: var(--fundo_4); } .capitulo_1.expansao { width: 15vw; transition: 1s ease; .Corpo_1 .Colunas_1 { width: 15vw; height: 26.5vh; transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_1 { opacity: 1; filter: blur(0px); transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_2 { opacity: 0; margin-top: 5vh; transform: scale(2.1); transition: 1s ease; } .Corpo_1 .Colunas_2 { width: 15vw; height: 73.5vh; transition: 1s ease; } } .capitulo_1:hover { width: 15vw; transition: 1s ease; .Corpo_1 .Colunas_1 { width: 15vw; height: 26.5vh; transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_1 { opacity: 1; filter: blur(0px); transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_2 { opacity: 0; filter: blur(20px); margin-top: 5vh; transform: scale(2.1); transition: 1s ease; } .Corpo_1 .Colunas_2 { width: 15vw; height: 73.5vh; transition: 1s ease; } } .Corpo_1 { display: flex; flex-direction: column; } .Corpo_1 .Colunas_1 { display: flex; flex-direction: row; background-image: url(../../Acessts/Imagens/Capa\ 1.png); background-position: center; background-size: cover; width: 15vw; height: 10vh; overflow: hidden; transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_1 { width: 15%; height: 30vh; background-color: #12365552; backdrop-filter: blur(8px); display: flex; order: 2; justify-content: center; align-items: start; align-content: center; } .Corpo_1 .Colunas_1 .seguimentos_1 button { background: none; outline: none; border: none; } .Corpo_1 .Colunas_1 .seguimentos_1 img { width: 1.5vw; margin-top: 1vh; padding: 0.5vh 0.5vw; border-radius: 10% 10% 10% 10%; } .Corpo_1 .Colunas_1 .seguimentos_1 img:hover { background-color: var(--fundo_2); } .Corpo_1 .Colunas_1 .seguimentos_2 { width: 85%; height: 30vh; order: 1; display: flex; color: var(--variante_font_1); flex-direction: column; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 img { width: 6vw; margin-top: 2vh; margin-left: 35%; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_1 { opacity: 0; filter: blur(20px); transition: 1s ease; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_2 { font-family: var(--font_titulo); font-size: 1.4vw; margin-left: 13%; text-align: center; } .Corpo_1 .Colunas_1 .seguimentos_2 .user_1 .icon_subcab2_2 { width: 2.5vw; opacity: 1; filter: blur(0px); position: absolute; top: 0; left: -0.8vw; transition: 1s ease; } .Corpo_1 .Colunas_2 { display: flex; flex-direction: row; position: relative; width: 15vw; background-color: var(--fundo_2); height: 90vh; transition: 1s ease; } .Corpo_1 .Colunas_2 .seguimentos_2 img { width: 1.5vw; padding-left: 1vw; } .Corpo_1 .Colunas_2 .seguimentos_2 a { font-family: var(--font_titulo); text-decoration: none; color: var(--variante_font_1); } .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_1 .forg .item_menu { font-family: var(--font_titulo); text-decoration: none; color: var(--variante_font_1); } .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_1 .forg .item_menu:hover { color: var(--variante_font_4); } .Corpo_1 .Colunas_2 .seguimentos_2 a:hover { color: var(--variante_font_4); } .sessao_1 { list-style: none; } .sessao_1 .item_menu { display: flex; gap: 2vw; align-items: center; align-content: center; } .sub_menu { display: flex; overflow: hidden; width: 100%; height: 1vh; transition: ease 1s; } .sub_menu.show { width: 100%; height: 15vh; background-color: var(--fundo_4); display: flex; overflow-y: auto; flex-direction: column; align-items: start; align-content: start; justify-content: start; transition: ease 1s; } .sub_item_1, .sub_item_2, .sub_item_3 { display: flex; align-items: center; justify-content: start; align-content: start; gap: 1vw; width: 15vw; height: 5vh; } .sub_item_1 p, .sub_item_2 p, .sub_item_3 p { color: rgb(249, 249, 252); font-family: var(--font_titulo); font-size: 0.9vw; } .sub_item_1 img, .sub_item_2 img, .sub_item_3 img { width: 1.5vw; padding-left: 1vw; } .sessao_2 .item_menu:hover, .sessao_1 .item_menu:hover { background-color: var(--fundo_4); transition: 1s ease; } .sub_item_1:hover, .sub_item_2:hover, .sub_item_3:hover { background-color: var(--fundo_1); transition: 1s ease; .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_1 .forg .item_menu { color: var(--variante_font_4); } } .sessao_2 .item_menu { display: flex; gap: 2vw; align-items: center; align-content: center; } .sessao_1 .item_menu p, .sessao_2 .item_menu p { font-size: 1vw; } .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_1, .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_2 { width: 100%; } .Corpo_1 .Colunas_2 .seguimentos_2 .sessao_1 { margin-top: 3vh; } .Corpo_1 .Colunas_2 .seguimentos_2 { display: flex; flex-direction: column; justify-content: space-between; width: 100%; } .capitulo_2 { display: flex; align-items: end; justify-content: end; align-content: end; width: 98vw; } .Corpo_2 .Colunas_1 .transmissão { width: 92vw; height: 82vh; transition: 1s ease; } .Corpo_2 iframe { outline: none; border: none; } .Corpo_2 .Colunas_1 .transmissão.expansao { width: 81vw; height: 82vh; transition: 1s ease; }