#page_block
{
    /*background-image: repeating-radial-gradient(farthest-side at 0% 0%, rgba(255,255,255, 0.1), rgba(255,255,255, 1));*/
    border: none 0px black;
}

#page_block #game_content
{
    position:relative;
    margin: 0%;
    height: auto;
    left:0%;
    border: ridge 2px rgba(255,255,255, 0.1);
    word-wrap: break-word;
    
    /*The following will ensure that the width of the element will not grow with the added border-size.
    So the border will be within the defined element width.
    */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

#page_block #block_content
{
    position:relative;
    width:100%;
    height: auto;
    margin: auto;
    border: solid 2px rgba(0,0,0,0.1);
    word-wrap: break-word;
    /*background-image: repeating-linear-gradient(to right, rgba(255,0,0, 0.1), rgba(255,255,0, 0.1), rgba(0,0,255, 0.1));*/
    
    /*The following will ensure that the width of the element will not grow with the added border-size.
    So the border will be within the defined element width.
    */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

#block_content #project_description
{
    position: relative;
    display: block;
    /*flex-wrap: wrap;*/
    word-wrap: break-word;
    overflow: hidden; /*this will ensure that the floated video will not overlap with anything outside this container*/
    margin: 2% auto;
    padding: 2%;

    font: var(--paragraph-font);
    text-align: left;
    border: solid 5px black;

    width: 98%;
    height: fit-content;
    border: solid 2px rgba(0,0,0,0.1);
    border-radius: 5vw;
    background-color: var(--header-footer-color);
    background-image: url("../../local/images/video_page_texture.jpg");
    background-blend-mode: overlay;
    background-position: center;
    background-size: var(--header-footer-background-size);
    background-repeat: repeat;*/
    
    /*The following will ensure that the width of the element will not grow with the added border-size.
    So the border will be within the defined element width.
    */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

#block_content #project_description {
  transition: opacity 0.5s ease-out;
}

.regular_ul{
    margin-left: 20px;
    list-style-type: square;
    list-style-position: inside; /*this will make the marker stick inside the list*/
    margin: 10px;
    padding: 0px;
}

#page_block video{
    position:relative;
    float: left;
    width: 60%;
    margin: 0%;
    margin-right: 20px;
    margin-bottom: 20px;
    padding: 0%;
    border: ridge 1vw rgba(0,0,0,0.1);
    border-radius: 5vw;
    /*The following will ensure that the width of the element will not grow with the added border-size.
    So the border will be within the defined element width.
    */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

@media (max-width: 768px) 
{
    #block_content #project_description video{
        width: 100%;
    }
}