/* RESET */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:"Segoe UI", Arial, sans-serif;
}

/* BODY */
body{
background:#FFD600;
}

/* NAVBAR */
.navbar{

position:fixed;
top:0;
left:0;

width:100%;
height:80px;

background:#000;

display:flex;
align-items:center;
justify-content:space-between;

padding:0 40px;

z-index:1200;

}

/* LINHA AMARELA */
.navbar::after{

content:"";

position:absolute;
bottom:0;
left:0;

width:100%;
height:4px;

background:#FFD600;

}

/* LOGO */
.logo img{
height:70px;
}

/* HAMBURGER */
.hamburger{

display:none;

font-size:26px;

color:#FFD600;

cursor:pointer;

padding:10px;

}

.hamburger:hover{
background:#FFD600;
color:#000;
}

/* MENU */
.menu{

display:flex;
align-items:center;

}

/* ITEM */
.menu-item{
position:relative;
}

/* LINK */
.menu-link{

display:flex;
align-items:center;

height:50px;

padding:0 20px;

color:#FFD600;

text-decoration:none;

font-weight:600;

cursor:pointer;

transition:0.2s;

width:100%;

}

/* HOVER */
.menu-link:hover{

background:#FFD600;
color:#000;

}

/* SETA */
.arrow{

margin-left:8px;
transition:0.3s;

}

.arrow.rotate{
transform:rotate(180deg);
}

/* SUBMENU DESKTOP */
.submenu{

position:absolute;

top:80px;
left:0;

min-width:280px;

background:#fff;

box-shadow:0 6px 16px rgba(0,0,0,0.25);

display:none;

flex-direction:column;

z-index:999;

}

.submenu.show{
display:flex;
}

/* LINK SUBMENU */
.submenu a{

padding:14px 18px;

text-decoration:none;

color:#000;

font-weight:500;

border-left:4px solid transparent;

}

.submenu a:hover{

background:#f5f5f5;

border-left:4px solid #FFD600;

}

/* CONTAINER */
.container{

margin-top:100px;

text-align:center;

padding:10px;

}

/* CARTAZ */
.cartaz{

background:#fff;

padding:4px;

border-radius:2px;

display:inline-block;

box-shadow:0 4px 14px rgba(0,0,0,0.2);

}

.cartaz img{
max-width:100%;
}

/* RODAPÉ */
footer{

margin-top:40px;

background:#000;

color:#FFD600;

text-align:center;

padding:25px;

}

/* MOBILE */
@media(max-width:768px){

.hamburger{
display:block;
}

.menu{

position:absolute;

top:80px;
left:0;

width:100%;

background:#000;

flex-direction:column;

display:none;

}

.menu.show{
display:flex;
}

.menu-item{
width:100%;
}

.menu-link{

width:100%;

border-bottom:1px solid rgba(255,255,255,0.1);

}

/* SUBMENU MOBILE CORRETO */
.submenu{

position:relative;

width:100%;

top:0;

background:#111;

box-shadow:none;

}

.submenu a{

width:100%;

padding-left:40px;

color:#FFD600;

border-bottom:1px solid rgba(255,255,255,0.05);

}

.submenu a:hover{

background:#FFD600;
color:#000;

}

}