* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: sans-serif;
}

#corpo1 {
    width: 100%;
    height: 500vh;
    background-color: white;
}

#menu {
    width: 100%;
    height: 25vh;
    background-color: #002250;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10%;
}

#menuX {
    width: 100%;
    background-color: white;
    height: 15vh;
    display: flex;
    justify-content: center;
}

#menuY {
    width: 70%;
    height: 15vh;
    background-color: white;
    display: flex;
    justify-content: space-between;
}

#logo {
    height: 15vh;
    width: 15%;
}

#logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}

#pesquisa {
    height: 100%;
    width: 25%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#pesquisaZ {
    width: 100%;
    height: 6vh;
    background-color: lightgray;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8%;
}

#pesquisaX {
    display: flex;
    flex-direction: column;
    gap: 10%;
    height: 2vh;
    width: 7%;
}

#pesquisa2Z {
    width: 100%;
    height: 0.3vh;
    background-color: black;
}

#pesquisaY {
    width: 65%;
    background-color: lightgray;
    border-color: transparent;
    margin-bottom: 1%;
    outline: none;
}

#icone1 {
    height: 100%;
    width: 10%;
    display: flex;
    align-items: center;

}

#icone2 {
    height: 100%;
    width: 10%;
    display: flex;
    align-items: center;
}

#icone3 {
    height: 100%;
    width: 10%;
    display: flex;
    align-items: center;
}

#icone1 svg {
    width: 100%;
    height: 5vh;
}

#CTN {text-decoration: none;
color: #000;}

#CTN:hover {text-decoration: underline;}

#icone2 svg {
    width: 100%;
    height: 5vh;
}

#icone3 svg {
    width: 100%;
    height: 5vh;
}

#sessaoZ {
    width: 100%;
    height: 2vh;
    display: flex;
    justify-content: space-evenly;
    position: relative;
}

#sessao1,
#sessao2,
#sessao3,
#sessao4 {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    position: relative;
    cursor: default;
}

#sessao1Z,
#sessao2Z,
#sessao3Z,
#sessao4Z {
    display: none;
    position: absolute;
    top: 100%;
    width: 100%;
    background-color: #000;
    color: white;
    padding-top: 10px;
    padding-bottom: 30px;
    text-align: center;
}

#sessao1:hover #sessao1Z,
#sessao2:hover #sessao2Z,
#sessao3:hover #sessao3Z,
#sessao4:hover #sessao4Z {
    display: block;
    height: auto;
    min-width: 200px;
    cursor: pointer;
}

#sessao1Y,
#sessao1X,
#sessao1W,
#sessao1V {
    margin-top: 20%;
    font-size: 22px;
    
}

#aZ {text-decoration: none;
color: #fff;}

#offerZ {
    width: 100%;
    height: 54vh;
    background-image: url(Anuncio.png);
    cursor: pointer;
}

#sessaoA {
    width: 100%;
    height: 7vh;
    background-color: #D9D9D9;
    display: flex;
    justify-content: space-evenly;
}

#sessao1A,
#sessao2A,
#sessao3A,
#sessao4A {
    width: 15%;
    height: 7vh;
}

#sessaoA div {
    display: flex;
    justify-content: center;
    align-items: center;
}

#sessaoA svg {
    width: 20%;
    height: 7vh;
}

#area1Z {
    width: 80%;
    height: 5vh;
    margin-left: 12.5%;
    display: flex;
    align-items: center;
}

#areaY {
    width: 40%;
    height: 0.5vh;
    background-color: lightgray;
}

#areaX {
    width: 10%;
    height: 5vh;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}

#areaW {
    width: 40%;
    height: 0.5vh;
    background-color: lightgray;
}

#produtoZ {
    width: 100%;
    height: 70vh;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3%;
}

#produto1Z {
    height: 66vh;
    width: 25%;
}

#produtoY {
    background-image: url(GuitarraP.jpg);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produto1Y {
    width: 100%;
    font-size: 28px;
}

#produto2Y {
    width: 100%;
}

#produto3Y {
    width: 100%;
    height: 5vh;
    background-color: gold;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 32px;
    text-decoration: none;
    color: #000;
}

#produto3Y:hover {text-decoration: underline;}

#produto2Z {
    height: 66vh;
    width: 25%;
}

#produtoX {
    background-image: url(PratosP.webp);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produto1X {
    width: 100%;
    font-size: 28px;
}

#produto2X {
    width: 100%;
}

#produto3X {
    width: 100%;
    height: 5vh;
    background-color: gold;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 32px;
    text-decoration: none;
    color: #000;
}

#produto3X:hover {text-decoration: underline;}

#produto3Z {
    height: 66vh;
    width: 25%;
}

#produtoW {
    background-image: url(BaixoP.webp);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produto1W {
    width: 100%;
    font-size: 28px;
}

#produto2W {
    width: 100%;
}

#produto3W {
    width: 100%;
    height: 5vh;
    background-color: gold;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 32px;
    text-decoration: none;
    color: #000;
}

#produto3W:hover {text-decoration: underline;}

#area2Z {
    width: 80%;
    height: 5vh;
    margin-left: 12.5%;
    display: flex;
    align-items: center;
    margin-top: 10%;
}

#offerY {
    width: 100%;
    height: 85vh;
    display: flex;
    justify-content: center;
    gap: 3%;
    padding-top: 5%;
}

#offer2Y {
    height: 45vh;
    width: 35%;
    background-color: crimson;
}

#offer2Y img {
    max-width: 100%;
    height: auto;
    display: block;
    cursor: pointer;
}

#offer3Y {
    height: 28vh; 
    width: 38%;
    background-color: #000;
}

#offer3Y img {
    max-width: 100%;
    height: auto;
    display: block;
    cursor: pointer;
}

#menuA {width: 100%;
height: 12.5vh;
background-color: #00E67B;}

#menu2A {width: 100%;
height: 12.5vh;
background-color: #00E67B;}

#menuB {width: 100%;
height: 15vh;
display: flex;
justify-content: center;
gap: 2%;
background-color: #D9D9D9;}

#menu1B, #menu2B, #menu3B, #menu4B {width: 15%;
height: 15vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;}

#menu1B img,
#menu2B img,
#menu3B img,
#menu4B img {cursor: pointer;}

#area3Z {
    width: 80%;
    height: 5vh;
    margin-left: 12.5%;
    display: flex;
    align-items: center;
    margin-top: 5%;
}

#produto1ZX {
    width: 100%;
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3%;
    margin-top: 10%;
}

#produtoAY {
    background-image: url(Amp1.webp);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoAX {
    background-image: url(Guita1.png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoAW {
    background-image: url(Baixo1.png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoBY {
    background-image: url(Baixo2.png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoBX {
    background-image: url(Teclado1.png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoBW {
    background-image: url(Bateria1.png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#menu3A {width: 100%;
height: 8vh;
background-color: #002250;}

#menu4A {width: 100%;
height: 5vh;
background-color: #002250;}


#menuC {width: 100%;
    height: 20vh;
display: flex;
justify-content: space-evenly;}

#menu1C {width: 20%;
    height: 20vh;
display: flex;
justify-content: center;
align-items: center;}

#menu1C img {max-width:55%;
height: auto;}

#menu2C {width: 15%;
    height: 20vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10%;}

.fimZ {font-size: 30px;}

.fimZX {display: flex;
flex-direction: column;
align-items: center;}

.fim1Z {margin-top: 10%;}

.fim2Z {margin-top: 10%;}

.fim3Z {margin-top: 10%;}

.fim4Z {margin-top: 10%;}

#menu3C {width: 15%;
    height: 20vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 10%;}

#menu4C {width: 15%;
    height: 20vh;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 20%;}

.fimZXY {width: 100%;
height: 5vh;
display: flex;
justify-content: space-between;
align-items: center;}

.fim1ZA svg, .fim2ZA svg, .fim3ZA svg {width: 50%;
display: flex;}

.fim1ZA, .fim2ZA, .fim3ZA {display: flex;
justify-content: center;
align-items: center;}

.fimZX a {text-decoration: underline;
color: #000;}

#corpo2 {height: 130vh;}

#menu1D {height: 125vh;
width: 100%;}

#bannerZ {height: 50vh;
    width: 100%;
background-image: url(Banner\ do\ YouTube\ Música\ Clássico\ Preto\ Branco.png);
background-size: cover;}

#textoZ {width: 70%;
height: 10vh;
margin-left: 15%;
margin-top: 4%;
font-size: 56px;}

#texto1Z {width: 70%;
height: 7vh;
margin-left: 15%;
font-size: 18px;}

#texto1Z div {margin-top: 5%;}

#item1Z {width: 100%;
height: 85vh;
display: flex;
}

#div1Z {width: 60%;}

#texto1X {width: 100%;
    height: 20vh;
    margin-left: 35%;
    padding-top: 7%;
font-size: 40px;}

#item2Z  {width: 60%;
height: 60vh;
margin-left: 38%;
margin-top: 3%;
background-image: url(GuitarraP.jpg);
background-size: cover;}

#div2Z {width: 50%;
height: 100vh;}

#compra1Z {width: 40%;
    height: 60vh;
margin-left: 30%;
margin-top: 15%;
border: 2px lightgray solid;}

#compra3Z {width: 90%;
margin-left: 2%;}

#texto2X {font-size: 32px;}

#div2Z {width: 100%;
height: 1vh;}

#texto3X {font-size: 40px;
color: #fc5f21;}

#texto4X {font-size: 28px;}

#div3Z {width: 100%;
height: 22vh;
margin-left: 2%;
margin-top: 14%;
color: #fc5f21;
font-size:38px;
display: flex;
flex-direction: column;}

#compra4Z {width: 80%;
height: 5vh;
margin-left: 10%;
background-color: #fc5f21;
display: flex;
align-items: center;
justify-content: center;
font-size: 26px;
margin-top: 2%;
}

#compra5Z {width: 80%;
height: 5vh;
margin-left: 10%;
background-color: #fc5f21;
display: flex;
align-items: center;
justify-content: center;
font-size: 26px;
margin-top: 5%;
}

#compra4Z:hover, #compra5Z:hover {cursor: pointer;}

#compra6Z {width: 40%;
    height: 3vh;
color: #008531;
margin-left: 2%;
font-size: 30px;}

#compra7Z {height: 4vh;
width: 70%;}

#item3Z {width: 100%;
height: 60vh;
}

#texto5X {width: 95%;
margin-left: 5%;
height: 5vh;
font-size: 40px;
}

#texto6X, #texto7X, #texto8X {width: 100%;
margin-top: 3%;
margin-left: 1%;
font-size: 22px;
}

#texto9X {width: 85%;
margin-left: 7.5%;
margin-top: 5%;}

#item4Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Amp1.webp);
background-size: cover;}

#item5Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Baixo1.png);
background-size: cover;}

#item6Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Baixo2.png);
background-size: cover;}

#item7Z  {width: 60%;
height: 60vh;
margin-left: 38%;
margin-top: 3%;
background-image: url(BaixoP.webp);
background-size: cover;}

#item8Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Bateria1.png);
background-size: cover;}

#item9Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Guita1.png);
background-size: cover;}

#item10Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(BaixoP.webp);
background-size: cover;}

#item11Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(PratosP.webp);
background-size: cover;}

#item12Z  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Teclado1.png);
background-size: cover;}


#corpo3 {height: 154vh;}


#div4Z {width: 100%;
height: 100vh;}

#texto2Y {height: 5vh;
width: 70%;
margin-left: 15%;
margin-top: 4%;
font-size: 46px;
text-decoration: underline;}

#produto1U {width: 200vh;}

#area4Z {
height: 10vh;}

#produto2U {height: 5vh;}

#formZ {width: 80%;
    height: 50vh;
    display: flex;
flex-direction: column;}

#form1 {width: 80%;
height: 60vh;
margin-left: 10%;
margin-top: 3%;
border: 1px lightgray solid;}

#form2 {width: 10%;
height: 4vh;
font-size: 20px;
background-color: #fc5f21;
border-radius: 20px;
color: #000;
margin-left: 2%;
margin-top: 2%;
display: flex;
align-items: center;
justify-content: center;}

#form4, #form5 {width: 50%;
    height: 3vh;
margin-left: 5%;}

#form6 {width: 80%;
    height: 10vh;
margin-left: 5%;}

#formZ label {margin-left: 5%;
margin-top: 4%;}

#form7 {width: 15%;
margin-left: 5%;
margin-top: 2%;
height: 4vh;}

#div5Z {height: 6vh;}

#lnkZ {text-decoration: none;
color: #000;}

#lnkZ:hover {text-decoration: underline;}

#formZX {width: 50%;
    height: 35vh;
    display: flex;
flex-direction: column;}

#formZY {width: 100%;
display: flex;
flex-direction: column;}

#formZY2 {width: 100%;
height: 30vh;
display: flex;
flex-direction: row;}

#formZ1 {width: 70%;
height: 50vh;
margin-left: 15%;
margin-top: 3%;
border: 1px lightgray solid;}

#formZ2 {width: 10%;
height: 4vh;
font-size: 20px;
background-color: lightgray;
border-radius: 20px;
color: #000;
margin-left: 44%;
margin-top: 2%;
display: flex;
align-items: center;
justify-content: center;}

#formZ4, #formZ5, #formZ6 {width: 55%;
    height: 4vh;
margin-left: 30%;}

#formZX label {margin-left: 30%;
margin-top: 4%;
width: 55%;}

#formZ7 {width: 15%;
margin-left: 5%;
margin-top: 2%;
height: 4vh;}

#formZ8, #formZ9, #formZ10 {width: 55%;
    height: 4vh;
margin-left: 10%;}

#formZX2 {width: 50%;
    height: 35vh;
    display: flex;
flex-direction: column;}

#formZX2 label {margin-left: 10%;
margin-top: 4%;
width: 55%;}

#butZ {display: flex;
justify-content: center;
align-content: center;}

#formZ2X {width: 10%;
height: 4vh;
font-size: 20px;
background-color: #fc5f21;
border-radius: 20px;
color: #000;
margin-left: 44%;
margin-top: 2%;
display: flex;
align-items: center;
justify-content: center;}

#formZ11 {width: 10%;
height: 4vh;
font-size: 20px;
background-color: #fc5f21;
border-radius: 20px;
margin-right: 1%;
color: #000;
display: flex;
align-items: center;
justify-content: center;
border: none;}

#formZ11:hover {cursor: pointer;}

#produtoMZ {
    background-image: url(Mixer1.Png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoMZ2 {
    background-image: url(BateriaEle.Png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#produtoMZ3 {
    background-image: url(Piano1.Png);
    background-size: cover;
    width: 100%;
    height: 50vh;
}

#itemAB  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Mixer1.Png);
background-size: cover;}

#itemAB2  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(BateriaEle.Png);
background-size: cover;}

#itemAB3  {width: 78%;
height: 60vh;
margin-left: 32%;
margin-top: 3%;
background-image: url(Piano1.Png);
background-size: cover;}