.container-f101{
    position: relative;
    width: auto;  
}
.container-f101 img {
        filter: brightness(75%);

}
.container-f101 h4{
    position: absolute; 
    bottom:78%;
    left: 6%;
    color: #faf9f1;
    font-family: 'DM sans ', sans-serif;
    font-size: 6vw; 
    font-weight: 600; 
    letter-spacing: 2px;
    width: inherit;    
    text-shadow: #0C0D1D 0px 0px 10px; 
    display: flex; 
    padding-left: 2vw;
    border-left: 3px solid rgb(54, 119, 116);;
}
.f101-links{
    background: #0C0D1D; 
    width: 100%;
    justify-content:center;
    display: flex;
    margin-top: -5px;
}
.f101-links a{
    width: 100%; 
    height:100%;
    font-size: 17px;
    color: #faf9f1
}
.f101-links li:hover {
    background: rgba(104, 104, 104, 0.7);
}   
.section-one{
    margin: 2vw;
}
.f101-links li{
    display: inline-block; 
    text-align: center;
    list-style: none; 
    padding: 10px 2vw;
    margin: 0 3vw;
    text-decoration: none;
    color: #faf9f1;
    transition: .4s;
}
#pitstops, #safety-car, #point-system{
    display: grid; 
    grid-template-columns: 1.07fr 1fr;
    grid-template-rows: auto;
    column-gap: 2vw;
    grid-template-areas: 
    "text cover" ;
    margin: 2vw 0;
}

#chequered-flags{
    display: grid; 
    grid-template-columns: 1fr 1.07fr;
    grid-template-rows: auto;
    column-gap: 2vw;
    grid-template-areas: 
    "cover text" 
    "flag flag";
    margin: 2vw 0;
}
.f1-flags{
    display:grid;
    grid-area: flag;
}
.flag-details{
    display: grid; 
    grid-template-columns: 0.6fr 1fr;
    grid-template-areas: 
    "head3 head3"
    "img text";
}

.flag-details p{
    grid-area: text; 
    line-height: 25px;
    margin: auto 2vw;
}
.flag-details img{
    grid-area: img; 
    margin:auto;
    height: 20vw;
    width: auto;
}
#tyre-compounds .f1-flags .flag-details h3{
    margin-top: 2vw;
    font-size: 30px;
    grid-area: head3;
}
.content-explanation h3, #tyre-compounds h3{
    font-family: "Playfair Display", Serif; 
    font-size: 40px;
    font-weight: 300;
    margin: 1.4vw 0;
}
.content-explanation p{
    font-weight: 300;
    margin: 1vw 0; 
    line-height: 25px;
    font-size: 16px;
}
#rules-picture{
    grid-area: cover; 
    margin: auto;
}
.content-explanation{
    grid-area: text;
    margin: auto;
}
.tyres {
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    column-gap: 1vw;
    margin: 1.4vw 0;
}
#tyre-compounds #tyre-picture{
    padding:0 8vw;
}
#pitstops, #safety-car, #point-system, #chequered-flags, #tyre-compounds {
    padding: 2vw 0 ; 
    border-bottom: 1px solid #737373;
}
@media only screen and (max-width: 800px){
.f101-links {
    display:none;
}
#pitstops, #safety-car, #point-system, #chequered-flags{
grid-template-columns: 1fr;
grid-template-areas: 
"cover"
"text" ;
}
#chequered-flags{
    grid-template-columns: 1fr;
    grid-template-areas: 
    "cover"
    "text"
    "flag" ;
    }
.flag-details {
    grid-template-columns: 1fr; 
    grid-template-areas:
    "head3" 
    "img"
    "text";
}
.content-explanation h3,#tyre-compounds h3{
    font-size: 25px;
}
.content-explanation p{
    font-size: 14px;
   line-height: 20px;
}
}