/*This is the CSS code for the background body color*/
            #body {
                background-color: orange;
                
            }

    /*This is the CSS code for the Navigation*/

                ul {
                    list-style-type: none;
                    margin: 0;
                    padding: 0;
                    overflow-x: hidden;
                    background-color: #333;
                    position: relative;
                    z-index: 10;
                }


                li {
                    float: left;
                    margin-left: 235px;
                    
                }


                li a {
                    display: block;
                    color: white;
                    text-align: center;
                    padding: 14px 25px;
                    text-decoration: none;
                    font-size: 20px;
                    
                }


                li a:hover:not(.active) {
                    background-color: #111;
                    
                }

                
                .active {
                    background-color: #4CAF50;
                    
                }


/*The CSS code for the About title and chibi pictures*/

              #Title {
                    text-decoration: underline;
                    font-size: 100px;
                    padding-top: 50px;
                    padding-bottom: 50px;
                    font-weight: bold;
                    text-align: center;
                    color: gray;
                    
                }


                .TitleContainer {
                    display: flex;
                    align-items: center;
                    justify-content: center;
    
                }


                .ChibiReinhardt {
                    margin-left: 50px;
    
                }


                .ChibiPharah {
                    margin-right: 50px;
    
                }


                .TitleText {
                    margin-left: 60px;
                    margin-right: 30px;
    
                }


                #ChibiPharah2 {
                    width: 375px;
                    height: 375px;
    
                }


                #ChibiReinhardt2 {
                    width: 400px;
                    height: 400px;
    
                }


/*CSS code for the background information*/

                #BackgroundHeading {
                    font-size: 60px;
                    font-family: fantasy;
                    text-align: center;
                    padding-top: 20px;
                    
                }

                #backgroundinfo {
                    margin-left: 100px;
                    margin-right: 100px;
                    text-indent: 30px;
    
                }

/*CSS code for the overview information*/


                #OverviewHeading {
                    font-size: 60px;
                    font-family: fantasy;
                    text-align: center;
                    padding-top: 20px;
    
                }


                #OverviewInfo {
                    margin-left: 100px;
                    margin-right: 100px;
                    text-indent: 30px;
    
                }

/*CSS code for the Development information*/


                #DevelopmentHeading {
                    font-size: 60px;
                    font-family: fantasy;
                    text-align: center;
                    padding-top: 20px;
    
                }

                #DevelopmentInfo {
                    margin-left: 100px;
                    margin-right: 100px;
                    text-indent: 30px;
    
                }



/*The CSS code for the genji and hanzo brother picture*/

                #brothers {
                    display: block;
                    margin-left: auto;
                    margin-right: auto;
    
                }