body {
    width: 100%;
    margin: 0px;
    padding: 0;
}

body header nav {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #B2D1EA;
    padding: 6px 148px 7px 151px;
}

body header nav ul {
    display: flex;
    gap: 70px;
    list-style: none;
    padding: 0;
}

body header nav ul li a {
    text-decoration: none;
    background-color: #3788C8;
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 20px;
    font-weight: bold;
    border-radius: 10px;
}

body header nav ul li a.accueil {
    padding: 11px 56px 12px 56px;
}

body header nav ul li a.evenements {
    padding: 11px 16px;
}

body header nav ul li a.qui {
    padding: 10px 9px;
}

body header nav ul li a.contact {
    padding: 10px 52px 11px 53px; 
}

body header nav img {
    width: 117px;
    height: 114px;
    margin: 0px 80px
}

body main section.banniereWeb {
    background-color: #B2D1EA;
    padding: 42px 171px 42px 172px;
}

body main section.banniereWeb div.banniere {
    background-image: url(./bannière\ web\ mydigitalweek.png);
    background-size: cover;
    padding: 21px 28px 88px 28px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

body main section.banniereWeb div.banniere p {
    color: white;
    font-size: 14px;
    font-family: "Lato", sans-serif;
    text-align: start;
    margin: 0;
    width: 100%;
}

body main section.banniereWeb div.banniere h1 {
    color: #1C507A;
    font-family: "Radley", serif;
    font-size: 64px;
    font-weight: normal;
    text-align: center;
    margin: 0;
}

body main section.banniereWeb div.banniere h2 {
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 22px;
    margin: 0;
    font-weight: normal;
    text-align: center;
}

body main section.banniereWeb div.banniere a {
    padding: 8px 20px 7px 20px;
    margin: 0;
    color: white;
    font-family: "Radley", serif;
    font-size: 16px;
    background-color: #3788C8;
    border: none;
    border-radius: 10px;
    text-align: center;
    margin-top: 27px;
    text-decoration: none;
}

body main section.biographie {
    display: flex;
    gap: 116px;
    padding: 49px 50px 48px 122px;
    align-items: center;
}

body main section.biographie img {
    width: 514px;
    height: 325px;
}

body main section.biographie div.myDigitalWeek {
    padding: 35px 41px 34px 42px;
    background-color: #706F6F;
    border-radius: 50px;
    text-align: center;
}

body main section.biographie div.myDigitalWeek h2 {
    color: white;
    font-family: "Radley", serif;
    font-size: 36px;
    font-weight: normal;
    margin: 0;
    margin-bottom: 24px;
}

body main section.biographie div.myDigitalWeek div.description p {
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 22px;
}

.carousel {
    position: relative;
    width: 100%;
    height: 575px; 
    overflow: hidden;
}
 
.carousel-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 800ms ease-in-out;
}
 
.carousel-item.active {
    opacity: 1;
    z-index: 1;
}

body main section.inscription {
    padding: 98px 30px 259px 30px;
    text-align: center;
}

body main section.inscription h2 {
    color: black;
    font-family: "Radley", serif;
    font-size: 52px;
    font-weight: normal;
    font-style: italic;
    margin: 0;
    margin-bottom: 100px;
}

body main section.inscription div.formulaires {
    display: flex;
    gap: 38px;
}

body main section.inscription div.formulaires form.intervenants {
    background-color: #706F6F;
    border-radius: 20px;
    padding: 23px 88px 34px 88px;
}

body main section.inscription div.formulaires form.intervenants h3, body main section.inscription div.formulaires form.etudiants h3 {
    font-family: "Radley", serif;
    font-size: 36px;
    font-weight: 400;
    margin: 0;
    margin-bottom: 36px;
    color: white;
}

body main section.inscription div.formulaires form.intervenants section.nomEmail, body main section.inscription div.formulaires form.intervenants section.telDispo {
    display: flex;
    gap: 94px;
}

body main section.inscription div.formulaires form.intervenants section.nomEmail div.nomEntreprise, body main section.inscription div.formulaires form.intervenants section.nomEmail div.email, body main section.inscription div.formulaires form.intervenants section.telDispo div.tel, body main section.inscription div.formulaires form.intervenants section.telDispo div.dispo {
    display: flex;
    flex-direction: column;
    text-align: start;
    gap: 8px;
}

body main section.inscription div.formulaires form.intervenants section.nomEmail div.nomEntreprise label, body main section.inscription div.formulaires form.intervenants section.nomEmail div.email label, body main section.inscription div.formulaires form.intervenants section.telDispo div.tel label, body main section.inscription div.formulaires form.intervenants section.telDispo div.dispo label {
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 22px;
}

body main section.inscription div.formulaires form.intervenants section.nomEmail div.nomEntreprise input, body main section.inscription div.formulaires form.intervenants section.nomEmail div.email input, body main section.inscription div.formulaires form.intervenants section.telDispo div.tel input, body main section.inscription div.formulaires form.intervenants section.telDispo div.dispo select {
    background-color: #989595;
    border: none;
    outline: none;
    border-radius: 10px;
    width: 201px;
    height: 33px;
    color: white;
    padding-left: 5px;
}

body main section.inscription div.formulaires form.intervenants button {
    margin-top: 58px;
    padding: 7px 40px 6px 40px;
    border-radius: 20px;
    background-color: #585656;
    border: none;
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 20px;
    cursor: pointer;
}

body main section.inscription div.formulaires form.etudiants {
    background-color: #3788C8;
    border-radius: 20px;
    padding: 23px 88px 34px 88px;
}

body main section.inscription div.formulaires form.etudiants section.nomPrenom, body main section.inscription div.formulaires form.etudiants section.emailTel { 
    display: flex;
    gap: 94px;
}

body main section.inscription div.formulaires form.etudiants section.nomPrenom div.nom, body main section.inscription div.formulaires form.etudiants section.nomPrenom div.prenom, body main section.inscription div.formulaires form.etudiants section.emailTel div.email2, body main section.inscription div.formulaires form.etudiants section.emailTel div.tel2 {
    display: flex;
    flex-direction: column;
    text-align: start;
    gap: 8px;
}

body main section.inscription div.formulaires form.etudiants section.nomPrenom div.nom label, body main section.inscription div.formulaires form.etudiants section.nomPrenom div.prenom label, body main section.inscription div.formulaires form.etudiants section.emailTel div.email2 label, body main section.inscription div.formulaires form.etudiants section.emailTel div.tel2 label {
    color: white;
    font-family: "Lato", sans-serif;
    font-size: 22px;
}

body main section.inscription div.formulaires form.etudiants section.nomPrenom div.nom input, body main section.inscription div.formulaires form.etudiants section.nomPrenom div.prenom input, body main section.inscription div.formulaires form.etudiants section.emailTel div.email2 input, body main section.inscription div.formulaires form.etudiants section.emailTel div.tel2 input {
    background-color: #B2D1EA;
    border: none;
    outline: none;
    border-radius: 10px;
    width: 201px;
    height: 33px;
    color: white;
    padding-left: 5px;
}

body main section.inscription div.formulaires form.etudiants button {
    margin-top: 58px;
    padding: 7px 40px 6px 40px;
    border-radius: 20px;
    background-color: white;
    border: none;
    color: #3788C8 ;
    font-family: "Lato", sans-serif;
    font-size: 20px;
    cursor: pointer;
}

body footer {
    background-color: #B2D1EA;
    display: flex;
    padding: 17px 13px 29px 13px;
    justify-content: space-between;
}

body footer img.mds {
    width: 201px;
    height: 201px;
    margin-right: 163px;
}

body footer nav.liens h2, body footer section.reseaux h2, body footer nav.infos h2 {
    font-family: "Radley", serif;
    font-size: 36px;
    font-weight: 400;
    margin: 0;
    margin-bottom: 26px;
}

body footer nav.liens ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
    margin-right: 69px;
}

body footer nav.liens ul li a {
    text-decoration: none;
    color: black;
    font-family: "Lato", sans-serif;
    font-size: 22px;
}

body footer section.reseaux div.logos {
    display: flex;
    gap: 33px;
    justify-content: center;
    margin-bottom: 29px;
}

body footer section.reseaux div.logos a {
    text-decoration: none;
}

body footer nav.infos {
    padding-left: 152px;
}

body footer nav.infos ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

body footer nav.infos ul li a {
    text-decoration: none;
    color: black;
    font-family: "Lato", sans-serif;
    font-size: 22px;
}

body footer div.logoMdw {
    display: flex;
    align-items: center;
}


body footer div.logoMdw img.mdw {
    padding-left: 19px;
    width: 176px;
    height: 172px;
}

@media screen and (min-width: 769px) {
    body header nav ul li a:hover {
        background-color: white;
        color: #3788C8;
    }

    body header nav ul li a {
        transition: background-color 0.5s,color 0.5s;
    }

    body main section.banniereWeb div.banniere a:hover {
        background-color: white;
        color: #3788C8;
    }

    body main section.banniereWeb div.banniere a {
        transition: background-color 0.5s,color 0.5s;
    }

    body main section.inscription div.formulaires form.intervenants button:hover {
        background-color: white;
        color: #585656;
    }

    body main section.inscription div.formulaires form.intervenants button {
        transition: background-color 0.5s,color 0.5s;
    }

    body main section.inscription div.formulaires form.etudiants button:hover {
        background-color: #B2D1EA;
        color: white;
    }

    body main section.inscription div.formulaires form.etudiants button {
        transition: background-color 0.5s,color 0.5s;
    }

    body footer nav.liens ul li a:hover {
        color: white;
    }

    body footer nav.liens ul li a {
        transition: color 0.5s;
    }

    body footer nav.infos ul li a:hover {
        color: white;
    }

    body footer nav.infos ul li a {
        transition: color 0.5s;
    }
}

@media screen and (max-width: 1024px) {
    body header nav {
        display: flex;
        flex-direction: column;
    }

    body main section.banniereWeb {
        padding: 42px 10px;
    }

    body main section.banniereWeb div.banniere {
        background-size: cover;
    }

    body main section.banniereWeb div.banniere p {
        font-size: 10px;
    }

    body main section.banniereWeb div.banniere h1 {
        font-size: 55px;
    }

    body main section.banniereWeb div.banniere h2 {
        font-size: 18px;
    }

    body main section.banniereWeb div.banniere a {
        font-size: 12px;
        padding: 8px 15px;
    }

    body main section.biographie {
        gap: 75px;
        padding: 35px 10px;
    }

    body main section.biographie img {
        width: 450px;
        height: 280px;
    }

    body main section.biographie div.myDigitalWeek h2 {
        font-size: 25px;
    }

    body main section.biographie div.myDigitalWeek div.description p {
        font-size: 16px;
    }

    .carousel-item {
        object-fit: contain;
    }

    body main section.inscription {
        padding: 0px 30px 259px;
    }

    body main section.inscription h2 {
        font-size: 45px;
    }

    body main section.inscription div.formulaires {
        flex-direction: column;
        align-items: center;
    }

    body footer {
        flex-direction: column;
        gap: 30px;
    }

    body footer section.reseaux div.logos {
        justify-content: start;
        margin: 0;
    }

    body footer nav.infos {
        padding: 0;
    }
}

@media screen and (max-width: 768px) {
    body header nav {
        flex-direction: row;
        padding: 6px 10px;
    }

    body header nav ul {
        gap: 20px;
    }

    body header nav ul li a {
        font-size: 10px;

    }

    body header nav ul li a.accueil {
        padding: 11px 20px;

    }

    body header nav ul li a.evenements {
        padding: 11px 20px;
    }

    body header nav ul li a.qui {
        padding: 11px 10px;
    }

    body header nav ul li a.contact {
        padding: 11px 20px;
    }

    body header nav img {
        width: 100px;
        height: 103px;
        margin: 0px 20px;
    }

    body main section.banniereWeb {
        padding: 20px 0px;
    }

    body main section.banniereWeb div.banniere {
        background-size: contain;
    }

    body main section.banniereWeb div.banniere p {
        font-size: 8px;
    }

    body main section.banniereWeb div.banniere h1 {
        font-size: 40px;
    }

    body main section.banniereWeb div.banniere h2 {
        font-size: 10px;
    }

    body main section.banniereWeb div.banniere a {
        font-size: 10px;
        padding: 4px 8px;
        margin-top: 10px;
    }

    body main section.biographie {
        margin-top: 115px;
    }

    body main section.biographie img {
        width: 300px;
        height: 200px;
        object-fit: contain;
    }

    body main section.biographie div.myDigitalWeek h2 {
        font-size: 18px;
    }

    body main section.biographie div.myDigitalWeek div.description p {
        font-size: 12px;
    }

    body main section.inscription div.formulaires form.intervenants {
        padding: 23px 70px;
    }

    body main section.inscription div.formulaires form.intervenants h3, body main section.inscription div.formulaires form.etudiants h3 {
        font-size: 25px;
    }

    body main section.inscription div.formulaires form.intervenants section.nomEmail div.nomEntreprise label, body main section.inscription div.formulaires form.intervenants section.nomEmail div.email label, body main section.inscription div.formulaires form.intervenants section.telDispo div.tel label, body main section.inscription div.formulaires form.intervenants section.telDispo div.dispo label {
        font-size: 18px;
    }

    body main section.inscription div.formulaires form.intervenants button {
        font-size: 18px;
        margin-top: 40px;
    }

    body main section.inscription div.formulaires form.etudiants {
        padding: 23px 70px
    }

    body main section.inscription div.formulaires form.etudiants section.nomPrenom div.nom label, body main section.inscription div.formulaires form.etudiants section.nomPrenom div.prenom label, body main section.inscription div.formulaires form.etudiants section.emailTel div.email2 label, body main section.inscription div.formulaires form.etudiants section.emailTel div.tel2 label {
        font-size: 18px;
    }

    body main section.inscription div.formulaires form.etudiants button {
        font-size: 18px;
        margin-top: 40px;
    }

    body footer {
        gap: 20px;
    }

    body footer nav.liens ul li a {
        font-size: 18px;
    }

    body footer nav.infos ul li a {
        font-size: 18px;
    }

    body footer div.logoMdw img.mdw {
        width: 100px;
        height: 103px;
    }
}