:root {
    --h-color: #031012;
    --p-color: #5E6263;
    --p-pt: 10px;
    --p-pp: 18px;
    --p-h3: 39px;
}
.p{
    padding-top: 20px;
    width:1040px;
    margin:0 auto;    
}
.p p {
    font-size: 14px;
    color: var(--p-color);
}

.p h3 {
    color: var(--h-color);
    font-family: 'HK Grotesk_semibold';
}

.p a {
    color: #269DB0;
}

.cgu h1 {
    font-size: 38px;
    font-family: 'HK Grotesk_bold';
    color: var(--h-color);
    padding-top: 28px;
}

.cgu p:nth-child(2) {
    padding-top: 12px;
}

.cgu p:nth-child(3) {
    padding-top: 41px;
}

.cgu_1,
.cgu_2,
.cgu_3,
.cgu_4,
.cgu_5,
.cgu_6,
.cgu_7,
.cgu_8,
.cgu_9 {
    padding-top: var(--p-h3);
}

.cgu_1 p,
.cgu_2 p:nth-child(2),
.cgu_3 p,
.cgu_4 p,
.cgu_5 p,
.cgu_6 p,
.cgu_7 p,
.cgu_8 p:nth-child(2),
.cgu_9 p:nth-child(2) {
    padding-top: var(--p-pt);
}

.cgu_2 p:nth-child(3),
.cgu_2 p:nth-child(4),
.cgu_2 p:nth-child(5) {
    padding-top: var(--p-pp);
}

.cgu_8 p:nth-child(3),
.cgu_8 p:nth-child(4) {
    padding-top: var(--p-pp);
}

.cgu_9 p:nth-child(3) {
    padding-top: var(--p-h3);
}

@media screen and (max-width:1100px) {
    .navbar{
        width: 100%;
    }
    .nav-bg{
        width: 100%;
    }
    .logo{
        width: 100%;
    }
    .lien{
        width: 100%;
        padding-right: 0px;
    }
    .p{
        width: 900px;
    }
    .cgu{
        width: 100%;
    }
    .cgu_1{
        width: 100%;
    }
    .cgu_2{
        width: 100%;
    }
    .cgu_3{
        width: 100%;
    }
    .cgu_4{
        width: 100%;
    }
    .cgu_5{
        width: 100%;
    }
    .cgu_6{
        width: 100%;
    }
    .cgu_7{
        width: 100%;
    }
    .cgu_8{
        width: 100%;
    }
    .cgu_9{
        width: 100%;
    }
}
@media screen and (max-width:950px) {
 

    .p{
        width:auto;
        padding: 0 20px;
    }
    .cgu h1 {
        font-size: 30px;
    }    
}