* {
              box-sizing: border-box;
            } 
            
            .headText {
                text-align: center;
                padding: 5px;
                margin: 5px;
                width: 100%;
                color: #2f2d63;
                font-size: 27;
                margin-bottom; 0px;
            }
            
            h4 {
                color: white;
                padding: 10px;
                padding-bottom: 0px;
                margin-bottom: 0px;
                margin: 0px;
                padding-top: 0px;
                margin-top: 25px;
                font-size: 20px;
                display: flex;
                flex-direction: row;
            }

            ul {
                list-style-type: none;
                margin: 0;
                margin-left: 5px;
                margin-top: 0px;
                padding: 0;
                display: flex;
                flex-direction: row;
            }

            li {
                display: flex;
                flex-direction: row;
                margin: 10px;
            }

            li a{
                text-decoration: none;
                color: white;
                font-size: 20px;
            }

            li a:hover {
              text-decoration: underline;
            }
            
            p {
                margin: 0px;
                margin-left: 10px;
                padding: 10px;
                color: #2f2d63;
            }

            .navText {
                margin: 0px;
                margin-top: 10px;
                text-align: center;
            }

            .headerText {
                margin: 0px;
                padding: 10px;
                margin-top: 10px;
                margin-bottom: 0px;
                padding-bottom; 0px;
            }



            body {
                background-image: url(images/royalcopen.jpg);
                background-size: 150px;
                color: white;
                display: grid;
                justify-content: center; 
                align-items: center; 
            }

            #bgmusic {
                position: absolute;
                width: 1px;
                height: 1px;
                opacity: 0;
                pointer-events: none;
                        }

            /* width */
            ::-webkit-scrollbar {
                width: 6px;
            }

            /* Track */
            ::-webkit-scrollbar-track {
                box-shadow: inset 0 0 5px grey; 
                border-radius: 10px;
                background: white; 
            }

            /* Handle */
            ::-webkit-scrollbar-thumb {
                background: #2f2d63; 
                border-radius: 10px;
            }

            /* Handle on hover */
            ::-webkit-scrollbar-thumb:hover {
                background: #514e96; 
            }
            
            .container {
                background-clip: padding-box;
                background-size: 200px 200px;
                border: transparent 3px ridge;
                height: 900px;
                width: 850px;
                justify-content: center;
                grid-column-gap: 10px;
                padding: 0px 0;
                display: grid;
                grid-template-areas: 
                    "header header"
                    "sidebarleft content";
            }
            
            .main-header {
                background-image: url(images/frederiks2.jpg);
                background-size: 800px 140px;
                background-color: #e5ecff;
                grid-area: header;
                color: darkblue;
                border: #2f2d63 3px solid;
                height: 140px;
                width: 800px;   
                padding: 25px;
                padding-top: 16px;
                padding-left: 25px;
                font-size: 35px;
                text-align: left;

            }
            
            
            .sidebar-left {
                background-color: #e5ecff;
                grid-area: sidebarleft;
                border: #2f2d63 3px solid;
                height: 740px;
                width: 160px;
                overflow-y: hidden;
                align-content: start;
                justify-items: center;
                padding: 15px;
                color: darkblue;
                
            }
            
            .content {
                background-color: #e5ecff;
                grid-area: content;
                border: #2f2d63 3px solid;
                height: 740px;
                width: 630px;
                align-content: start;
                justify-items: start;
                text-align: left;
                display: grid;
                overflow-x: hidden;
                overflow-y: auto;
                overflow-wrap: break-word;
                padding: 10px;
            }
            
            .content img {
                justify-items: center;
                margin: 0px auto;
                margin-top: 10px;
                margin-bottom: 20px;
            }
            
            .content iframe {
                justify-items: center;
                margin: 0px auto;
                margin-top: 10px;
                margin-bottom: 20px;
            }
            
            .content a {
                justify-items: center;
                margin: 0px auto;
                margin-top: 10px;
                margin-bottom: 20px;
            }
            
            .sidebar-left a {
                margin-bottom: 10px;
                display: block; /* my bad */
            }