@font-face{
  font-family:BrunoAceSC;
  src:url(/static/css/fonts/Bruno_Ace_SC/BrunoAceSC-Regular.woff2) format("woff2"), url(/static/css/fonts/Bruno_Ace_SC/BrunoAceSC-Regular.woff) format("woff"), url(/static/css/fonts/Bruno_Ace_SC/BrunoAceSC-Regular.ttf) format("truetype");
}
#auth-form{

    border:1px solid #ccc;
    box-shadow:0 4px 8px rgba(0,0,0,.1);
    position:fixed;
    top:20px;

    form{
        display:flex;
        flex-direction:column;
        gap:5px;

        input{
            border:1px solid transparent;
            border-bottom-color:#e7e7e7;
            color:#111;
            min-height:24px;
            padding:2px 4px;

            &:focus{
                outline:none;
            }
        }
    }
}
body,html{
    font-family:Arial,sans-serif;
    height:100%;
    margin:0;
    padding:0;
}
body{
    display:grid;
    grid-template-areas:"a a" "b c" "d d";
    grid-template-columns:1fr 5fr;
    grid-template-rows:auto 1fr auto;
    height:100vh;

    header{
        grid-area:a;
        text-align:center;

        .header-content{
            align-items:center;
            background-color:#cd0024;
            display:flex;
            height:30px;
            justify-content:space-between;
            padding:0 5px;

            .logo{
                color:#fff;
                font-family:BrunoAceSC,sans-serif;
                font-size:24px;
                text-decoration:none;

            }

            nav{
                position:relative;
                width:100%;

                ul{
                    display:flex;
                    gap:20px;
                    justify-content:center;
                    list-style:none;

                    li{
                        a{
                            color:#fff;
                            text-decoration:none;

                            &:hover{
                                text-decoration:underline;
                            }
                        }
                    }
                }
            }
        }
    }

    aside{
        &.sidebar{
            background-color:#f4f4f4;
            padding:20px;

            &:nth-child(3){
                grid-area:b;
            }

            &:nth-child(5){
                grid-area:e;
            }
        }
    }

    main{
        background-color:#e2e2e2;
        grid-area:c;
    }

    footer,main{
        padding:20px;
    }

    footer{
        background-color:#222;
        color:#fff;
        grid-area:d;
        text-align:center;
    }
}
#burger{
    background:none;
    border:none;
    color:#fff;
    display:none;
    font-size:24px;
    position:absolute;
    right:20px;
    top:15px;
}
#menu{
    display:flex;
    gap:20px;
}
#user-info{
    padding-right:10px;

    ul{
        color:#fff;
        display:flex;
        font-size:12px;
        gap:8px;
        list-style:none;
    }
}
/*# sourceMappingURL=layout.min.css.map */