@media only screen and (min-width: 1501px){
     header .nav-ul li:nth-child(3) .link-menu{
          border-bottom: 3px solid #a8639a;
          border-radius: 20px;
     }
}

@media only screen and (max-width: 1500px){
     header .nav-ul .nav-li:nth-child(3){
          border-bottom: 3px solid #a8639a;
     }
}

#page{
     display: flex;
     flex-direction: column;
}

section{
     display: flex;
}

section:not(#intro) .container{
     margin: 0 auto;
     border: 1px solid #783f6d;
     background-color: #f9f9f9;
     border-radius: 10px;
     box-shadow: 0px 10px 20px -10px #575756;
     padding: 20px;
}

#intro{
     background-image: url(../Data/reunion.jpg);
     background-attachment: fixed;
     background-repeat: no-repeat;
     background-size: 2010px auto;
     background-position: -10px -70px;
}

#intro .filter{
     width: 100%;
     height: 100%;
     background: rgba(55,63,69,0.4);
}

#intro h1{
     font-size: 36px;
    margin-top: 70px;
    margin-left: 200px;
    color: #ffffff;
}

section:not(#intro) .header{
     margin-bottom: 10px;
     display: flex;
     justify-content: space-between;
}

#page section .header h2{
     font-size: 29px;
     margin-top: 20px;
     margin-bottom: 0px;
     margin-left: 20px;
     color: #a8639A;
}

#page section .certif-footer{
     margin-top: 50px;
     display: flex;
     justify-content: space-between;
     font-style: italic;
}

#page section p{
     margin: 0px;
}

#tosa .content p:nth-child(2),
#voltaire .content p:nth-child(2),
#leveltel .content p:nth-child(2) {
     margin-top: 20px;
     margin-bottom: 20px;
}

#voltaire .content p:nth-child(3),
#leveltel .content p:nth-child(3) {
     margin-bottom: 20px;
}

#robert .content div:nth-child(2){
     margin-top: 20px;
     margin-bottom: 20px;
}

#toeic .content p:nth-child(2){
     margin-top: 20px;
     margin-bottom: 20px;
}

#toeic .content p:nth-child(3){
     margin-bottom: 20px;
}

#page .arrow:before{
     content: '\e82f';
     font-family: unicons;
     font-style: normal;
     font-weight: 400;
     speak: none;
     display: inline-block;
     text-decoration: inherit;
     width: 1em;
     margin-right: .2em;
     text-align: center;
     font-variant: normal;
     text-transform: none;
     line-height: 1em;
     margin-left: .2em;
     -webkit-font-smoothing: antialiased;
}

table{
     margin: 30px auto 0px auto;
     border-collapse: collapse;
     background-color: #ffffff;
}

table th{
     border: 1px solid #a8639a;
     font-weight: lighter;
}

#tosa table th{
     width: 140px;
     height: 45px;
}

#voltaire table th{
     width: 140px;
     height: 50px;
}

#robert table th{
     width: 200px;
     height: 40px;
}

#leveltel table th{
     width: 100px;
     height: 45px;
     font-size: 14px;
}

table .header-table{
     color: #a8639a;
     font-weight: bolder;
     font-style: italic;
     background-color: #f0e5ef;
}

@media only screen and (max-width: 1000px){
     #page .container .title h1{
          text-align: center;
          margin: 30px auto;
          font-size: 30px;
     }

     #page section:not(#intro) .container{
          padding: 10px;
     }
}

@media only screen and (min-width: 0px){

     #page section:not(#intro){
          font-size: 14px;
          margin: 40px auto;
     }

     #page .container .header img{
          display: none;
     }

     #page table{
          font-size: 12px;
     }

     #page tbody{
          display: flex;
     }

     #page table tbody tr{
          display: grid;
     }

     #robert table th{
          width: 169px;
     }

     #robert table tr th:nth-child(2){
          height: 70px;
     }

     #robert table tr th:nth-child(3){
          height: 60px;
     }

     #robert table tr th:last-child{
          height: 90px;
     }

     #toeic table th{
          width: 110px;
     }
}

@media only screen and (min-width: 501px){
     #page .container, #page section:not(#intro){
          width: 480px !important;
     }
     #page .container .header img{
          display: block;
     }

}

@media only screen and (min-width: 761px){
     #page .container, #page section:not(#intro){
          width: 730px !important;
     }

     section:not(#intro){
          margin: 100px auto;
     }
}

@media only screen and (min-width: 1001px){
     #page .container, #page section:not(#intro){
          width: 1000px !important;
     }

     #intro{
          height: 200px;
     }

     #page tbody{
          display: block;
     }

     #page table tbody tr{
          display: block;
     }

     #page table{
          font-size: 16px;
     }

     #robert table th {
          width: 156px;
     }
}
